DSNiemeyer

Cores

Paleta completa do Niemeyer — brand, neutrals, escalas e tokens semânticos.

Brand Colors

As cores da marca Morada.ai. Use com moderação — prefira tokens semânticos.

Black

--morada-black

#1d1d1b

Blue — Primary

--morada-blue

#0073ff

Cya — Secondary

--morada-cya

#00ffe0

Orange — Tertiary

--morada-orange

#f7b87d

Cyan

--morada-cyan

#02cfff

Dark Purple

--morada-dark-purple

#38384d

Coral

--morada-coral

#f27d82

Light Orange

--morada-light-orange

#fad499

Yellow

--morada-yellow

#fcf2a3

Tokens Semânticos

Mudam de valor entre temas e modos. Sempre use estes em componentes.

Background

--background

Fundo da página

Foreground

--foreground

Texto principal

Card

--card

Fundo de cards

Muted

--muted

Áreas sutis

Muted Foreground

--muted-foreground

Texto secundário

Primary

--primary

Ação principal

Primary Foreground

--primary-foreground

Texto sobre primary

Secondary

--secondary

Ação secundária (morada-cya)

Secondary Foreground

--secondary-foreground

Texto sobre secondary

Tertiary

--tertiary

Ação terciária (morada-orange)

Tertiary Foreground

--tertiary-foreground

Texto sobre tertiary

Accent

--accent

Hover/destaque

Destructive

--destructive

Ações perigosas

Border

--border

Bordas

Input

--input

Borda de inputs

Ring

--ring

Focus ring

Feedback Colors

Success

Exemplo de mensagem de success.

Warning

Exemplo de mensagem de warning.

Info

Exemplo de mensagem de info.

Destructive

Exemplo de mensagem de destructive.

Neutral Scale

Base cool blue-gray derivada de #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