Registrarse Registrarse
Blue To Yellow

Blue To Yellow

Paleta de 8 colores · Colores fríos · Tonos oscuros · Armonía complementaria

Volver a la biblioteca

Blue To Yellow

Paleta de 8 colores · Colores fríos · Tonos oscuros · Armonía complementaria

Editar
Colores apagados 8 colores Colores fríos Tonos oscuros Armonía complementaria monoramp blue yellow colorramp
Me gusta 23
Colores 8

Variables CSS

:root {
  --c-muted-1: #1C325E;
  --c-muted-2: #404F59;
  --c-muted-3: #616952;
  --c-muted-4: #787B4A;
  --c-muted-5: #105060;
  --c-muted-6: #386A50;
  --c-muted-7: #608441;
  --c-muted-8: #889D31;
}

Sobre esta paleta

Esta paleta de 8 colores apagados va de Vigorous Wasabi (#889D31), su tono más claro, a Ending Navy Blue (#1C325E), el más oscuro. Combina Ending Navy Blue, Presidential, Rosemary Sprig, Tara’s Drapes, Teal Dark Blue, Jungle Book Green, Shepherd’s Green y Vigorous Wasabi en un solo conjunto que puedes llevar directamente a una interfaz. Ninguna de las 28 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

Ending Navy Blue #1C325E
RGB
rgb(28, 50, 94)
HSL
hsl(220, 54%, 24%)
Luminancia
0,033
Presidential #404F59
RGB
rgb(64, 79, 89)
HSL
hsl(204, 16%, 30%)
Luminancia
0,074
Rosemary Sprig #616952
RGB
rgb(97, 105, 82)
HSL
hsl(81, 12%, 37%)
Luminancia
0,133
Tara’s Drapes #787B4A
RGB
rgb(120, 123, 74)
HSL
hsl(64, 25%, 39%)
Luminancia
0,187
Teal Dark Blue #105060
RGB
rgb(16, 80, 96)
HSL
hsl(192, 71%, 22%)
Luminancia
0,067
Jungle Book Green #386A50
RGB
rgb(56, 106, 80)
HSL
hsl(149, 31%, 32%)
Luminancia
0,117
Shepherd’s Green #608441
RGB
rgb(96, 132, 65)
HSL
hsl(92, 34%, 39%)
Luminancia
0,194
Vigorous Wasabi #889D31
RGB
rgb(136, 157, 49)
HSL
hsl(72, 52%, 40%)
Luminancia
0,296

Contraste y accesibilidad

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

Aa #1C325E sobre #889D31 4,15:1 AA, texto grande
Aa #105060 sobre #889D31 2,96:1 No aprobado
Aa #1C325E sobre #608441 2,92:1 No aprobado
Aa #1C325E sobre #787B4A 2,84:1 No aprobado
Aa #404F59 sobre #889D31 2,79:1 No aprobado
Aa #1C325E sobre #616952 2,19:1 No aprobado
Aa #105060 sobre #608441 2,08:1 No aprobado
Aa #386A50 sobre #889D31 2,07:1 No aprobado
Aa #787B4A sobre #105060 2,02:1 No aprobado
Aa #1C325E sobre #386A50 2,01:1 No aprobado
Aa #404F59 sobre #608441 1,96:1 No aprobado
Aa #404F59 sobre #787B4A 1,91:1 No aprobado
Aa #616952 sobre #889D31 1,89:1 No aprobado
Aa #616952 sobre #105060 1,56:1 No aprobado
Aa #1C325E sobre #404F59 1,49:1 No aprobado
Aa #404F59 sobre #616952 1,47:1 No aprobado
Aa #787B4A sobre #889D31 1,46:1 No aprobado
Aa #386A50 sobre #608441 1,46:1 No aprobado
Aa #105060 sobre #386A50 1,43:1 No aprobado
Aa #608441 sobre #889D31 1,42:1 No aprobado
Aa #787B4A sobre #386A50 1,41:1 No aprobado
Aa #1C325E sobre #105060 1,40:1 No aprobado
Aa #404F59 sobre #386A50 1,35:1 No aprobado
Aa #616952 sobre #608441 1,34:1 No aprobado
Aa #616952 sobre #787B4A 1,30:1 No aprobado
Aa #616952 sobre #386A50 1,09:1 No aprobado
Aa #404F59 sobre #105060 1,06:1 No aprobado
Aa #787B4A sobre #608441 1,03: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