Skip to main content

Colors

Color is a tool to maintain brand identity as a product, and it should be able to express clear information hierarchy within the software through color contrast to minimize user confusion.

Update Types
🟠 Existing Update
🔵 New Addition

Basic Color​

Scale Token is a standardized color token that defines a consistent color system for the product. It is used when there is no specific semantic characteristic or context, and Scale Tokens can be used in any case.

Grayscale​

The most basic black and white colors with no transparency.

Color1

Alpha Color​

Colors with transparency, mainly used in combination with backgrounds or other elements by adjusting transparency.

White Alpha​

Color2

Gray Alpha​

Color3

Static Color​

Colors that are not affected by light or dark themes and always retain raw values. Primarily used for elements that appear on top of overlays.

Light​

Color4

Dark​

Color5

System Color​

Background​

The background color that wraps content and information. Located at the lowest level of the Z-axis.

Color6

Button​

Color7

Controller​

Color8

Climate​

Color9

Color10

Dim​

Color11

Driving​

Color12

Fields​

Color13

Gleo AI​

Color14

Icon​

Color15

Informative​

Color15

Keyboard​

Normal​

Color16

Static​

Color17

Media​

Color18

Overlay​

Color19

Phone​

Color20

Regulation​

Color21

Surface​

Color22

Switch​

Color23

Text​

Color24