Copied!

DesignOps platform

The goal of DesignOps is to establish processes and measures that support scalable solutions for these challenges, so that designers can focus on designing and researching.

Your brand

Color

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Arcu, egestas sed tellus in. Turpis neque neque vitae feugiat semper donec commodo. Vel a pharetra vitae tortor. Proin egestas lobortis velit, iaculis a.

Light theme Dark theme

General

Applicable to backgrounds, icons, components

Black 100
Background, Surface, Canvas
Black 200
Background alt
Black 800
Icon
Black 500
Icon hover
Blue 500
Primary, Highlight, Link
Blue 400
Secondary, Hover

Type

The only colors used for our typography

Black 800
H1, H2 etc
Black 600
Body, Paragraph
Black 500
Hint
Black 400
Disabled
Black 100
Inverse
Blue 500
Hyperlink

Status

Use the following colors to denote the status of an object, task, or flow. Can be container, outline, icon or text

Green 500
Success, Positive
Yellow 500
Alert, Warning
Red 500
Error, Destructive
Black 300
Icon hover
Light theme Dark theme

General

Applicable to backgrounds, icons, components

Black 800
Background, Surface, Canvas
Black 700
Background alt
Black 100
Icon
Black 500
Icon hover
Blue 500
Primary, Highlight, Link
Blue 400
Secondary, Hover

Type

The only colors used for our typography

Black 100
H1, H2 etc
Black 300
Body, Paragraph
Black 500
Hint
Black 600
Disabled
Black 100
Inverse
Blue 500
Hyperlink

Status

Use the following colors to denote the status of an object, task, or flow. Can be container, outline, icon or text

Green 500
Success, Positive
Yellow 500
Alert, Warning
Red 500
Error, Destructive
Ink 300
Disabled

UI color palette

100
200
‍
300
400
500
600
700
800
No items found.
View Figma resource