Registrarse Registrarse
Shelf6

Shelf6

Paleta de 6 colores · Colores fríos · Tonos oscuros · Armonía análoga

Volver a la biblioteca

Shelf6

Paleta de 6 colores · Colores fríos · Tonos oscuros · Armonía análoga

Editar
Colores apagados 6 colores Colores fríos Tonos oscuros Armonía análoga blue purple aa
Me gusta 23
Colores 6

Variables CSS

:root {
  --c-muted-1: #2A2540;
  --c-muted-2: #372C51;
  --c-muted-3: #423458;
  --c-muted-4: #464A73;
  --c-muted-5: #546799;
  --c-muted-6: #5A80A7;
}

Sobre esta paleta

Esta paleta de 6 colores apagados va de Sapphired (#5A80A7), su tono más claro, a Telopea (#2A2540), el más oscuro. Combina Telopea, Midnight Pie, Naggaroth Night, Purple Berry, UCLA Blue y Sapphired en un solo conjunto que puedes llevar directamente a una interfaz. Ninguna de las 15 combinaciones de colores de la paleta alcanza el umbral de contraste WCAG AA (4,5:1), así que, para el texto principal, combina estos colores con negro o blanco.

Una paleta versátil para páginas de marketing, bloques hero de producto, ilustraciones y estados de acento de la interfaz.

Desglose de colores

Telopea #2A2540
RGB
rgb(42, 37, 64)
HSL
hsl(251, 27%, 20%)
Luminancia
0,022
Midnight Pie #372C51
RGB
rgb(55, 44, 81)
HSL
hsl(258, 30%, 25%)
Luminancia
0,032
Naggaroth Night #423458
RGB
rgb(66, 52, 88)
HSL
hsl(263, 26%, 27%)
Luminancia
0,043
Purple Berry #464A73
RGB
rgb(70, 74, 115)
HSL
hsl(235, 24%, 36%)
Luminancia
0,074
UCLA Blue #546799
RGB
rgb(84, 103, 153)
HSL
hsl(223, 29%, 46%)
Luminancia
0,139
Sapphired #5A80A7
RGB
rgb(90, 128, 167)
HSL
hsl(210, 30%, 50%)
Luminancia
0,204

Contraste y accesibilidad

Combinaciones de colores en la paleta: 15. De ellas, 0 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal.

Aa #2A2540 sobre #5A80A7 3,54:1 AA, texto grande
Aa #372C51 sobre #5A80A7 3,09:1 AA, texto grande
Aa #423458 sobre #5A80A7 2,73:1 No aprobado
Aa #2A2540 sobre #546799 2,63:1 No aprobado
Aa #372C51 sobre #546799 2,30:1 No aprobado
Aa #464A73 sobre #5A80A7 2,04:1 No aprobado
Aa #423458 sobre #546799 2,03:1 No aprobado
Aa #2A2540 sobre #464A73 1,73:1 No aprobado
Aa #372C51 sobre #464A73 1,52:1 No aprobado
Aa #464A73 sobre #546799 1,52:1 No aprobado
Aa #546799 sobre #5A80A7 1,35:1 No aprobado
Aa #423458 sobre #464A73 1,33:1 No aprobado
Aa #2A2540 sobre #423458 1,30:1 No aprobado
Aa #2A2540 sobre #372C51 1,14:1 No aprobado
Aa #372C51 sobre #423458 1,14:1 No aprobado

Paletas similares

#212121 #323232 #0D7377 #14FFEC
4 colores
#0A2647 #144272 #205295 #2C74B3
4 colores
#040D12 #183D3D #5C8374 #93B1A6
4 colores
#142850 #27496D #0C7B93 #00A8CC
4 colores
#635985 #443C68 #393053 #18122B
4 colores
#000000 #150050 #3F0071 #610094
4 colores
#151515 #301B3F #3C415C #B4A5A5
4 colores
#041C32 #04293A #064663 #ECB365
4 colores