DSNiemeyer
Language
PTEN

Colors

The full Niemeyer palette — brand, neutrals, scales, and semantic tokens.

Brand colors

The Morada.ai brand colors. Use sparingly — prefer semantic tokens.

Black

--morada-black

#1d1d1b

Blue — primary

--morada-blue

#0073ff

Cyan

--morada-cyan

#02cfff

Cya — secondary

--morada-cya

#00ffe0

Dark purple

--morada-dark-purple

#38384d

Coral

--morada-coral

#f27d82

Orange — tertiary

--morada-orange

#f7b87d

Light orange

--morada-light-orange

#fad499

Yellow

--morada-yellow

#fcf2a3

Semantic tokens

Values change with themes and modes. Always use these in components.

Background

--background

Page background

Foreground

--foreground

Primary text

Card

--card

Card surfaces

Muted

--muted

Subtle areas

Muted Foreground

--muted-foreground

Secondary text

Primary

--primary

Main action

Primary Foreground

--primary-foreground

Text on primary

Secondary

--secondary

Secondary action (morada-cya)

Secondary Foreground

--secondary-foreground

Text on secondary

Tertiary

--tertiary

Tertiary action (morada-orange)

Tertiary Foreground

--tertiary-foreground

Text on tertiary

Accent

--accent

Hover and highlights

Destructive

--destructive

Destructive actions

Border

--border

Borders

Input

--input

Input borders

Ring

--ring

Focus ring

Feedback colors

Success

Sample success message.

Warning

Sample warning message.

Info

Sample info message.

Destructive

Sample destructive message.

Neutral scale

Cool blue-gray base derived from #606A80.

50
100
150
200
300
400
500
600
700
800
850
900
950

50

#F7F8FA

100

#ECEEF3

150

#E1E4EA

200

#D3D7E0

300

#B4BAC8

400

#8D95A8

500

#606A80

600

#4E5668

700

#3C4354

800

#2B303E

850

#232836

900

#1A1E2B

950

#10131C

Color scales

Blue — primary

1
2
3
4
5
6
7
8
9
10

1

#f0f7ff

2

#e0efff

3

#b8dbff

4

#85c1ff

5

#4da3ff

6

#0073ff

7

#005ecc

8

#004a99

9

#003566

10

#001f3d

Cya — secondary (#00ffe0)

1
2
3
4
5
6
7
8
9
10

1

#ebfffc

2

#c5fff5

3

#9cfde9

4

#52fadb

5

#19ffec

6

#00ffe0

7

#00ccb3

8

#009987

9

#006659

10

#003d35

Orange — tertiary (#f7b87d)

1
2
3
4
5
6
7
8
9
10

1

#fff5ec

2

#ffe4cc

3

#fccda0

4

#fac085

5

#f7b87d

6

#f2a05c

7

#e07c2a

8

#c05e16

9

#9a460d

10

#6b2e07

Green — success (emerald)

1
2
3
4
5
6
7
8
9
10

1

#ecfdf5

2

#d1fae5

3

#a7f3d0

4

#6ee7b7

5

#34d399

6

#10b981

7

#059669

8

#047857

9

#065f46

10

#064e3b

Cyan

1
2
3
4
5
6
7
8
9
10

1

#ECFDFF

2

#D4F9FF

3

#A8F0FF

4

#6BE4FF

5

#2FD6FF

6

#02CFFF

7

#00AEDB

8

#008DB2

9

#006D8A

10

#004D63

Danger (red)

1
2
3
4
5
6
7
8
9
10

1

#fef2f2

2

#fee2e2

3

#fecaca

4

#fca5a5

5

#f87171

6

#ef4444

7

#dc2626

8

#b91c1c

9

#991b1b

10

#7f1d1d

Warning (amber)

1
2
3
4
5
6
7
8
9
10

1

#fffbeb

2

#fef3c7

3

#fde68a

4

#fcd34d

5

#fbbf24

6

#f59e0b

7

#d97706

8

#b45309

9

#92400e

10

#78350f