token
Design System

uDefine UI Kit v1.0

The official comprehensive UI Kit and Style Guide for uDefine SAP Consulting. This system ensures consistency across our digital products and enterprise solutions.

Color Palette

Our color system is built to be accessible and reflect the professional nature of SAP consulting.

Primary Blues

Primary
Electric Blue #136DEC rgb(19, 109, 236)
Navy
Deep Navy #0F172A
Slate
Slate Blue #334155
Base
Dark Base #101822

Neutrals

White #FFFFFF
Light Gray #F6F7F8
Charcoal #1E293B
Pure Black #000000

Status & Accents

Emerald Green #10B981 Success
Amber Orange #F59E0B Warning
Ruby Red #EF4444 Error

Typography

Inter is our primary typeface. It is clean, legible, and optimized for UI.

Heading 1

The Quick Brown Fox

Size: 36px Weight: 900 Line: 1.25
Heading 2

Jumps Over The Lazy Dog

Size: 30px Weight: 700 Line: 1.3
Heading 3

SAP S/4HANA Solutions

Size: 24px Weight: 700 Line: 1.4
Body Large

Empowering enterprises with intelligent solutions. We define the future of business technology through expert consulting and innovative strategies.

Size: 18px Weight: 400
Body Default

uDefine specializes in SAP integration, data analytics, and cloud transformation. Our team of experts works tirelessly to ensure your digital infrastructure is robust, scalable, and secure.

Size: 16px Weight: 400
Caption / Small

© 2023 uDefine Consulting. All rights reserved. Version 1.0.4

Size: 14px Weight: 400

UI Components

Core interactive elements and form controls.

Buttons

Inputs & Forms

mail

Iconography

We use Material Symbols Outlined for clarity and consistency. These icons should primarily be used in stroke format at 24px.

dashboard
dashboard
analytics
analytics
settings
settings
group
group
cloud_sync
cloud_sync
verified
verified