Registrarse Registrarse
Médor9

Médor9

Paleta de 9 colores · Colores cálidos · Tonos mixtos · Armonía análoga

Volver a la biblioteca

Médor9

Paleta de 9 colores · Colores cálidos · Tonos mixtos · Armonía análoga

Editar
Colores vibrantes 9 colores Colores cálidos Tonos mixtos Armonía análoga 9colors dog
Me gusta 19
Colores 9

Variables CSS

:root {
  --c-vibrant-1: #E5E5E5;
  --c-vibrant-2: #E8C53C;
  --c-vibrant-3: #BAB200;
  --c-vibrant-4: #D88C1A;
  --c-vibrant-5: #BC6336;
  --c-vibrant-6: #666600;
  --c-vibrant-7: #68294E;
  --c-vibrant-8: #47211A;
  --c-vibrant-9: #270E0E;
}

Sobre esta paleta

Esta paleta de 9 colores vibrantes va de Cold Morning (#E5E5E5), su tono más claro, a Italian Roast (#270E0E), el más oscuro. Combina Cold Morning, Lime Drop, Muddy Yellow, Apricot Chicken, Smoke Tree, Earthy Khaki Green, Ebizome Purple, Marmite y Italian Roast en un solo conjunto que puedes llevar directamente a una interfaz. Combinaciones de colores en la paleta: 36. De ellas, 12 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal; la de mayor contraste es #E5E5E5 sobre #270E0E, con 14,43: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

Cold Morning #E5E5E5
RGB
rgb(229, 229, 229)
HSL
hsl(0, 0%, 90%)
Luminancia
0,784
Lime Drop #E8C53C
RGB
rgb(232, 197, 60)
HSL
hsl(48, 79%, 57%)
Luminancia
0,574
Muddy Yellow #BAB200
RGB
rgb(186, 178, 0)
HSL
hsl(57, 100%, 36%)
Luminancia
0,423
Apricot Chicken #D88C1A
RGB
rgb(216, 140, 26)
HSL
hsl(36, 79%, 47%)
Luminancia
0,334
Smoke Tree #BC6336
RGB
rgb(188, 99, 54)
HSL
hsl(20, 55%, 47%)
Luminancia
0,199
Earthy Khaki Green #666600
RGB
rgb(102, 102, 0)
HSL
hsl(60, 100%, 20%)
Luminancia
0,123
Ebizome Purple #68294E
RGB
rgb(104, 41, 78)
HSL
hsl(325, 43%, 28%)
Luminancia
0,051
Marmite #47211A
RGB
rgb(71, 33, 26)
HSL
hsl(9, 46%, 19%)
Luminancia
0,025
Italian Roast #270E0E
RGB
rgb(39, 14, 14)
HSL
hsl(0, 47%, 10%)
Luminancia
0,008

Contraste y accesibilidad

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

Aa #E5E5E5 sobre #270E0E 14,43:1 AAA
Aa #E5E5E5 sobre #47211A 11,11:1 AAA
Aa #E8C53C sobre #270E0E 10,80:1 AAA
Aa #E8C53C sobre #47211A 8,32:1 AAA
Aa #E5E5E5 sobre #68294E 8,27:1 AAA
Aa #BAB200 sobre #270E0E 8,18:1 AAA
Aa #D88C1A sobre #270E0E 6,65:1 AA
Aa #BAB200 sobre #47211A 6,30:1 AA
Aa #E8C53C sobre #68294E 6,19:1 AA
Aa #D88C1A sobre #47211A 5,12:1 AA
Aa #E5E5E5 sobre #666600 4,81:1 AA
Aa #BAB200 sobre #68294E 4,69:1 AA
Aa #BC6336 sobre #270E0E 4,31:1 AA, texto grande
Aa #D88C1A sobre #68294E 3,81:1 AA, texto grande
Aa #E8C53C sobre #666600 3,60:1 AA, texto grande
Aa #E5E5E5 sobre #BC6336 3,35:1 AA, texto grande
Aa #BC6336 sobre #47211A 3,32:1 AA, texto grande
Aa #666600 sobre #270E0E 3,00:1 AA, texto grande
Aa #BAB200 sobre #666600 2,73:1 No aprobado
Aa #E8C53C sobre #BC6336 2,51:1 No aprobado
Aa #BC6336 sobre #68294E 2,47:1 No aprobado
Aa #666600 sobre #47211A 2,31:1 No aprobado
Aa #D88C1A sobre #666600 2,22:1 No aprobado
Aa #E5E5E5 sobre #D88C1A 2,17:1 No aprobado
Aa #BAB200 sobre #BC6336 1,90:1 No aprobado
Aa #E5E5E5 sobre #BAB200 1,76:1 No aprobado
Aa #68294E sobre #270E0E 1,74:1 No aprobado
Aa #666600 sobre #68294E 1,72:1 No aprobado
Aa #E8C53C sobre #D88C1A 1,62:1 No aprobado
Aa #D88C1A sobre #BC6336 1,54:1 No aprobado
Aa #BC6336 sobre #666600 1,44:1 No aprobado
Aa #E5E5E5 sobre #E8C53C 1,34:1 No aprobado
Aa #68294E sobre #47211A 1,34:1 No aprobado
Aa #E8C53C sobre #BAB200 1,32:1 No aprobado
Aa #47211A sobre #270E0E 1,30:1 No aprobado
Aa #BAB200 sobre #D88C1A 1,23:1 No aprobado

Paletas similares

#F9ED69 #F08A5D #B83B5E #6A2C70
4 colores
#7D5A50 #B4846C #E5B299 #FCDEC0
4 colores
#FFF8EA #9E7676 #815B5B #594545
4 colores
#2C3639 #3F4E4F #A27B5C #DCD7C9
4 colores
#F67280 #C06C84 #6C5B7B #355C7D
4 colores
#2B2E4A #E84545 #903749 #53354A
4 colores
#E5D9B6 #A4BE7B #5F8D4E #285430
4 colores
#A9907E #F3DEBA #ABC4AA #675D50
4 colores