QUALM12

QUALM12

Paleta de 12 colores · Colores neutros · Tonos mixtos · Armonía triádica

QUALM12

Paleta de 12 colores · Colores neutros · Tonos mixtos · Armonía triádica

Editar
Colores terrosos 12 colores Colores neutros Tonos mixtos Armonía triádica artist muted grim rust
Me gusta 22
Colores 12


Variables CSS

:root {
  --c-earthy-1: #0E0917;
  --c-earthy-2: #1A1429;
  --c-earthy-3: #282440;
  --c-earthy-4: #42363F;
  --c-earthy-5: #5C473E;
  --c-earthy-6: #8A746A;
  --c-earthy-7: #B5A39C;
  --c-earthy-8: #FCF8FB;
  --c-earthy-9: #9FADB3;
  --c-earthy-10: #6B818A;
  --c-earthy-11: #3E535C;
  --c-earthy-12: #40454E;
}

Sobre esta paleta

Esta paleta de 12 colores terrosos va de Snowman (#FCF8FB), su tono más claro, a Midnight Oil (#0E0917), el más oscuro. Combina Midnight Oil, Sambucus, Midnight Velvet, Deep Space Frigate, Tannery Brown, Pine Bark, Chocolate Oatmeal, Snowman, Pelican Bay, Citadel, Slate Wall y Alpine Duck Grey en un solo conjunto que puedes llevar directamente a una interfaz. Combinaciones de colores en la paleta: 66. De ellas, 16 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal; la de mayor contraste es #0E0917 sobre #FCF8FB, con 18,65:1.

Tonos naturales y serenos que encajan con marcas sostenibles y ecológicas, cafeterías, equipamiento de montaña y tipografía editorial cálida.


Desglose de colores

Midnight Oil #0E0917
RGB
rgb(14, 9, 23)
HSL
hsl(261, 44%, 6%)
Luminancia
0,004
Sambucus #1A1429
RGB
rgb(26, 20, 41)
HSL
hsl(257, 34%, 12%)
Luminancia
0,009
Midnight Velvet #282440
RGB
rgb(40, 36, 64)
HSL
hsl(249, 28%, 20%)
Luminancia
0,021
Deep Space Frigate #42363F
RGB
rgb(66, 54, 63)
HSL
hsl(315, 10%, 24%)
Luminancia
0,042
Tannery Brown #5C473E
RGB
rgb(92, 71, 62)
HSL
hsl(18, 19%, 30%)
Luminancia
0,071
Pine Bark #8A746A
RGB
rgb(138, 116, 106)
HSL
hsl(19, 13%, 48%)
Luminancia
0,189
Chocolate Oatmeal #B5A39C
RGB
rgb(181, 163, 156)
HSL
hsl(17, 14%, 66%)
Luminancia
0,384
Snowman #FCF8FB
RGB
rgb(252, 248, 251)
HSL
hsl(315, 40%, 98%)
Luminancia
0,948
Pelican Bay #9FADB3
RGB
rgb(159, 173, 179)
HSL
hsl(198, 12%, 66%)
Luminancia
0,405
Citadel #6B818A
RGB
rgb(107, 129, 138)
HSL
hsl(197, 13%, 48%)
Luminancia
0,207
Slate Wall #3E535C
RGB
rgb(62, 83, 92)
HSL
hsl(198, 19%, 30%)
Luminancia
0,080
Alpine Duck Grey #40454E
RGB
rgb(64, 69, 78)
HSL
hsl(219, 10%, 28%)
Luminancia
0,059

Contraste y accesibilidad

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

Aa #0E0917 sobre #FCF8FB 18,65:1 AAA
Aa #1A1429 sobre #FCF8FB 16,97:1 AAA
Aa #282440 sobre #FCF8FB 14,09:1 AAA
Aa #42363F sobre #FCF8FB 10,90:1 AAA
Aa #FCF8FB sobre #40454E 9,16:1 AAA
Aa #0E0917 sobre #9FADB3 8,51:1 AAA
Aa #5C473E sobre #FCF8FB 8,23:1 AAA
Aa #0E0917 sobre #B5A39C 8,11:1 AAA
Aa #1A1429 sobre #9FADB3 7,74:1 AAA
Aa #FCF8FB sobre #3E535C 7,69:1 AAA
Aa #1A1429 sobre #B5A39C 7,38:1 AAA
Aa #282440 sobre #9FADB3 6,43:1 AA
Aa #282440 sobre #B5A39C 6,13:1 AA
Aa #42363F sobre #9FADB3 4,97:1 AA
Aa #0E0917 sobre #6B818A 4,80:1 AA
Aa #42363F sobre #B5A39C 4,74:1 AA
Aa #0E0917 sobre #8A746A 4,47:1 AA, texto grande
Aa #1A1429 sobre #6B818A 4,36:1 AA, texto grande
Aa #9FADB3 sobre #40454E 4,18:1 AA, texto grande
Aa #8A746A sobre #FCF8FB 4,17:1 AA, texto grande
Aa #1A1429 sobre #8A746A 4,07:1 AA, texto grande
Aa #B5A39C sobre #40454E 3,98:1 AA, texto grande
Aa #FCF8FB sobre #6B818A 3,89:1 AA, texto grande
Aa #5C473E sobre #9FADB3 3,75:1 AA, texto grande
Aa #282440 sobre #6B818A 3,62:1 AA, texto grande
Aa #5C473E sobre #B5A39C 3,58:1 AA, texto grande
Aa #9FADB3 sobre #3E535C 3,51:1 AA, texto grande
Aa #282440 sobre #8A746A 3,38:1 AA, texto grande
Aa #B5A39C sobre #3E535C 3,34:1 AA, texto grande
Aa #42363F sobre #6B818A 2,80:1 No aprobado
Aa #42363F sobre #8A746A 2,61:1 No aprobado
Aa #0E0917 sobre #3E535C 2,43:1 No aprobado
Aa #6B818A sobre #40454E 2,36:1 No aprobado
Aa #B5A39C sobre #FCF8FB 2,30:1 No aprobado
Aa #0E0917 sobre #5C473E 2,27:1 No aprobado
Aa #1A1429 sobre #3E535C 2,21:1 No aprobado
Aa #8A746A sobre #40454E 2,20:1 No aprobado
Aa #FCF8FB sobre #9FADB3 2,19:1 No aprobado
Aa #5C473E sobre #6B818A 2,12:1 No aprobado
Aa #1A1429 sobre #5C473E 2,06:1 No aprobado
Aa #0E0917 sobre #40454E 2,04:1 No aprobado
Aa #6B818A sobre #3E535C 1,98:1 No aprobado
Aa #5C473E sobre #8A746A 1,97:1 No aprobado
Aa #8A746A sobre #9FADB3 1,90:1 No aprobado
Aa #1A1429 sobre #40454E 1,85:1 No aprobado
Aa #8A746A sobre #3E535C 1,84:1 No aprobado
Aa #282440 sobre #3E535C 1,83:1 No aprobado
Aa #8A746A sobre #B5A39C 1,81:1 No aprobado
Aa #9FADB3 sobre #6B818A 1,77:1 No aprobado
Aa #0E0917 sobre #42363F 1,71:1 No aprobado
Aa #282440 sobre #5C473E 1,71:1 No aprobado
Aa #B5A39C sobre #6B818A 1,69:1 No aprobado
Aa #1A1429 sobre #42363F 1,56:1 No aprobado
Aa #282440 sobre #40454E 1,54:1 No aprobado
Aa #42363F sobre #3E535C 1,42:1 No aprobado
Aa #0E0917 sobre #282440 1,32:1 No aprobado
Aa #42363F sobre #5C473E 1,32:1 No aprobado
Aa #282440 sobre #42363F 1,29:1 No aprobado
Aa #1A1429 sobre #282440 1,20:1 No aprobado
Aa #42363F sobre #40454E 1,19:1 No aprobado
Aa #3E535C sobre #40454E 1,19:1 No aprobado
Aa #5C473E sobre #40454E 1,11:1 No aprobado
Aa #0E0917 sobre #1A1429 1,10:1 No aprobado
Aa #5C473E sobre #3E535C 1,07:1 No aprobado
Aa #8A746A sobre #6B818A 1,07:1 No aprobado
Aa #B5A39C sobre #9FADB3 1,05:1 No aprobado

Paletas similares

#EDF1D6 #9DC08B #609966 #40513B
4 colores
#F5F7F8 #F4CE14 #495E57 #45474B
4 colores
#222831 #393E46 #FFD369 #EEEEEE
4 colores
#000000 #52057B #892CDC #BC6FF1
4 colores
#213555 #3E5879 #D8C4B6 #F5EFE7
4 colores
#F5EFE7 #D8C4B6 #4F709C #213555
4 colores
#191A19 #1E5128 #4E9F3D #D8E9A8
4 colores
#352F44 #5C5470 #B9B4C7 #FAF0E6
4 colores