Registrarse Registrarse
Hetzelfde

Hetzelfde

Paleta de 12 colores · Colores fríos · Tonos oscuros · Armonía monocromática

Volver a la biblioteca

Hetzelfde

Paleta de 12 colores · Colores fríos · Tonos oscuros · Armonía monocromática

Editar
Colores apagados 12 colores Colores fríos Tonos oscuros Armonía monocromática gray black white red
Me gusta 31
Colores 12

Variables CSS

:root {
  --c-muted-1: #3E3F4A;
  --c-muted-2: #5D606B;
  --c-muted-3: #6F687C;
  --c-muted-4: #91929B;
  --c-muted-5: #1D1E26;
  --c-muted-6: #2E2A34;
  --c-muted-7: #293455;
  --c-muted-8: #4C5F81;
  --c-muted-9: #B4D8F7;
  --c-muted-10: #FFFFFF;
  --c-muted-11: #6E053D;
  --c-muted-12: #FF0100;
}

Sobre esta paleta

Esta paleta de 12 colores apagados va de White (#FFFFFF), su tono más claro, a Noble Black (#1D1E26), el más oscuro. Combina Indian Ink, Concrete Landscape, Victorian Iris, Lilac Fields, Noble Black, Haiti, Midnight Escapade, Bijou Blue, Blue Rice, White, Spanish Purple y Red en un solo conjunto que puedes llevar directamente a una interfaz. Combinaciones de colores en la paleta: 66. De ellas, 15 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal; la de mayor contraste es #1D1E26 sobre #FFFFFF, con 16,59:1.

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

Desglose de colores

Indian Ink #3E3F4A
RGB
rgb(62, 63, 74)
HSL
hsl(235, 9%, 27%)
Luminancia
0,051
Concrete Landscape #5D606B
RGB
rgb(93, 96, 107)
HSL
hsl(227, 7%, 39%)
Luminancia
0,118
Victorian Iris #6F687C
RGB
rgb(111, 104, 124)
HSL
hsl(261, 9%, 45%)
Luminancia
0,147
Lilac Fields #91929B
RGB
rgb(145, 146, 155)
HSL
hsl(234, 5%, 59%)
Luminancia
0,289
Noble Black #1D1E26
RGB
rgb(29, 30, 38)
HSL
hsl(233, 13%, 13%)
Luminancia
0,013
Haiti #2E2A34
RGB
rgb(46, 42, 52)
HSL
hsl(264, 11%, 18%)
Luminancia
0,025
Midnight Escapade #293455
RGB
rgb(41, 52, 85)
HSL
hsl(225, 35%, 25%)
Luminancia
0,036
Bijou Blue #4C5F81
RGB
rgb(76, 95, 129)
HSL
hsl(218, 26%, 40%)
Luminancia
0,113
Blue Rice #B4D8F7
RGB
rgb(180, 216, 247)
HSL
hsl(208, 81%, 84%)
Luminancia
0,655
White #FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
Luminancia
1,000
Spanish Purple #6E053D
RGB
rgb(110, 5, 61)
HSL
hsl(328, 91%, 23%)
Luminancia
0,038
Red #FF0100
RGB
rgb(255, 1, 0)
HSL
hsl(0, 100%, 50%)
Luminancia
0,213

Contraste y accesibilidad

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

Aa #1D1E26 sobre #FFFFFF 16,59:1 AAA
Aa #2E2A34 sobre #FFFFFF 14,03:1 AAA
Aa #293455 sobre #FFFFFF 12,23:1 AAA
Aa #FFFFFF sobre #6E053D 11,99:1 AAA
Aa #1D1E26 sobre #B4D8F7 11,14:1 AAA
Aa #3E3F4A sobre #FFFFFF 10,42:1 AAA
Aa #2E2A34 sobre #B4D8F7 9,42:1 AAA
Aa #293455 sobre #B4D8F7 8,22:1 AAA
Aa #B4D8F7 sobre #6E053D 8,05:1 AAA
Aa #3E3F4A sobre #B4D8F7 7,00:1 AAA
Aa #4C5F81 sobre #FFFFFF 6,44:1 AA
Aa #5D606B sobre #FFFFFF 6,27:1 AA
Aa #91929B sobre #1D1E26 5,36:1 AA
Aa #6F687C sobre #FFFFFF 5,32:1 AA
Aa #91929B sobre #2E2A34 4,54:1 AA
Aa #4C5F81 sobre #B4D8F7 4,33:1 AA, texto grande
Aa #5D606B sobre #B4D8F7 4,21:1 AA, texto grande
Aa #1D1E26 sobre #FF0100 4,15:1 AA, texto grande
Aa #FFFFFF sobre #FF0100 4,00:1 AA, texto grande
Aa #91929B sobre #293455 3,95:1 AA, texto grande
Aa #91929B sobre #6E053D 3,87:1 AA, texto grande
Aa #6F687C sobre #B4D8F7 3,57:1 AA, texto grande
Aa #2E2A34 sobre #FF0100 3,51:1 AA, texto grande
Aa #3E3F4A sobre #91929B 3,37:1 AA, texto grande
Aa #6F687C sobre #1D1E26 3,12:1 AA, texto grande
Aa #91929B sobre #FFFFFF 3,09:1 AA, texto grande
Aa #293455 sobre #FF0100 3,06:1 AA, texto grande
Aa #6E053D sobre #FF0100 3,00:1 AA, texto grande
Aa #B4D8F7 sobre #FF0100 2,68:1 No aprobado
Aa #5D606B sobre #1D1E26 2,65:1 No aprobado
Aa #6F687C sobre #2E2A34 2,64:1 No aprobado
Aa #3E3F4A sobre #FF0100 2,61:1 No aprobado
Aa #1D1E26 sobre #4C5F81 2,58:1 No aprobado
Aa #6F687C sobre #293455 2,30:1 No aprobado
Aa #6F687C sobre #6E053D 2,25:1 No aprobado
Aa #5D606B sobre #2E2A34 2,24:1 No aprobado
Aa #2E2A34 sobre #4C5F81 2,18:1 No aprobado
Aa #91929B sobre #4C5F81 2,08:1 No aprobado
Aa #91929B sobre #B4D8F7 2,08:1 No aprobado
Aa #5D606B sobre #91929B 2,03:1 No aprobado
Aa #3E3F4A sobre #6F687C 1,96:1 No aprobado
Aa #5D606B sobre #293455 1,95:1 No aprobado
Aa #5D606B sobre #6E053D 1,91:1 No aprobado
Aa #293455 sobre #4C5F81 1,90:1 No aprobado
Aa #4C5F81 sobre #6E053D 1,86:1 No aprobado
Aa #6F687C sobre #91929B 1,72:1 No aprobado
Aa #3E3F4A sobre #5D606B 1,66:1 No aprobado
Aa #3E3F4A sobre #4C5F81 1,62:1 No aprobado
Aa #4C5F81 sobre #FF0100 1,61:1 No aprobado
Aa #3E3F4A sobre #1D1E26 1,59:1 No aprobado
Aa #5D606B sobre #FF0100 1,57:1 No aprobado
Aa #B4D8F7 sobre #FFFFFF 1,49:1 No aprobado
Aa #1D1E26 sobre #6E053D 1,38:1 No aprobado
Aa #1D1E26 sobre #293455 1,36:1 No aprobado
Aa #3E3F4A sobre #2E2A34 1,35:1 No aprobado
Aa #6F687C sobre #FF0100 1,33:1 No aprobado
Aa #91929B sobre #FF0100 1,29:1 No aprobado
Aa #6F687C sobre #4C5F81 1,21:1 No aprobado
Aa #5D606B sobre #6F687C 1,18:1 No aprobado
Aa #1D1E26 sobre #2E2A34 1,18:1 No aprobado
Aa #3E3F4A sobre #293455 1,17:1 No aprobado
Aa #2E2A34 sobre #6E053D 1,17:1 No aprobado
Aa #3E3F4A sobre #6E053D 1,15:1 No aprobado
Aa #2E2A34 sobre #293455 1,15:1 No aprobado
Aa #5D606B sobre #4C5F81 1,03:1 No aprobado
Aa #293455 sobre #6E053D 1,02: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