Soft Sunny Days

Soft Sunny Days

Paleta de 12 colores · Colores neutros · Tonos mixtos · Armonía complementaria

Soft Sunny Days

Paleta de 12 colores · Colores neutros · Tonos mixtos · Armonía complementaria

Editar
Colores terrosos 12 colores Colores neutros Tonos mixtos Armonía complementaria soft soundsdotzip small 12
Me gusta 41
Colores 12


Variables CSS

:root {
  --c-earthy-1: #0B0A0D;
  --c-earthy-2: #5E656E;
  --c-earthy-3: #BAAE95;
  --c-earthy-4: #FFF8F2;
  --c-earthy-5: #75BAE6;
  --c-earthy-6: #3A3878;
  --c-earthy-7: #469173;
  --c-earthy-8: #7BC456;
  --c-earthy-9: #FAD461;
  --c-earthy-10: #E37444;
  --c-earthy-11: #B0305A;
  --c-earthy-12: #613321;
}

Sobre esta paleta

Esta paleta de 12 colores terrosos va de Sugar Milk (#FFF8F2), su tono más claro, a Raven (#0B0A0D), el más oscuro. Combina Raven, Lava Grey, Nile Sand, Sugar Milk, Costa Rica Blue, Torea Bay, Good Luck, Green Flash, Salmon Eggs, Jaffa, Blood Thorn y Chubby Chocolate en un solo conjunto que puedes llevar directamente a una interfaz. Combinaciones de colores en la paleta: 66. De ellas, 19 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal; la de mayor contraste es #0B0A0D sobre #FFF8F2, con 18,77: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

Raven #0B0A0D
RGB
rgb(11, 10, 13)
HSL
hsl(260, 13%, 5%)
Luminancia
0,003
Lava Grey #5E656E
RGB
rgb(94, 101, 110)
HSL
hsl(214, 8%, 40%)
Luminancia
0,128
Nile Sand #BAAE95
RGB
rgb(186, 174, 149)
HSL
hsl(41, 21%, 66%)
Luminancia
0,429
Sugar Milk #FFF8F2
RGB
rgb(255, 248, 242)
HSL
hsl(28, 100%, 97%)
Luminancia
0,948
Costa Rica Blue #75BAE6
RGB
rgb(117, 186, 230)
HSL
hsl(203, 69%, 68%)
Luminancia
0,446
Torea Bay #3A3878
RGB
rgb(58, 56, 120)
HSL
hsl(242, 36%, 35%)
Luminancia
0,051
Good Luck #469173
RGB
rgb(70, 145, 115)
HSL
hsl(156, 35%, 42%)
Luminancia
0,228
Green Flash #7BC456
RGB
rgb(123, 196, 86)
HSL
hsl(100, 48%, 55%)
Luminancia
0,444
Salmon Eggs #FAD461
RGB
rgb(250, 212, 97)
HSL
hsl(45, 94%, 68%)
Luminancia
0,683
Jaffa #E37444
RGB
rgb(227, 116, 68)
HSL
hsl(18, 74%, 58%)
Luminancia
0,292
Blood Thorn #B0305A
RGB
rgb(176, 48, 90)
HSL
hsl(340, 57%, 44%)
Luminancia
0,121
Chubby Chocolate #613321
RGB
rgb(97, 51, 33)
HSL
hsl(17, 49%, 25%)
Luminancia
0,050

Contraste y accesibilidad

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

Aa #0B0A0D sobre #FFF8F2 18,77:1 AAA
Aa #0B0A0D sobre #FAD461 13,78:1 AAA
Aa #FFF8F2 sobre #613321 9,96:1 AAA
Aa #FFF8F2 sobre #3A3878 9,90:1 AAA
Aa #0B0A0D sobre #75BAE6 9,33:1 AAA
Aa #0B0A0D sobre #7BC456 9,28:1 AAA
Aa #0B0A0D sobre #BAAE95 9,00:1 AAA
Aa #FAD461 sobre #613321 7,31:1 AAA
Aa #3A3878 sobre #FAD461 7,27:1 AAA
Aa #0B0A0D sobre #E37444 6,44:1 AA
Aa #FFF8F2 sobre #B0305A 5,84:1 AA
Aa #5E656E sobre #FFF8F2 5,60:1 AA
Aa #0B0A0D sobre #469173 5,23:1 AA
Aa #75BAE6 sobre #613321 4,95:1 AA
Aa #7BC456 sobre #613321 4,93:1 AA
Aa #75BAE6 sobre #3A3878 4,92:1 AA
Aa #3A3878 sobre #7BC456 4,90:1 AA
Aa #BAAE95 sobre #613321 4,78:1 AA
Aa #BAAE95 sobre #3A3878 4,75:1 AA
Aa #FAD461 sobre #B0305A 4,29:1 AA, texto grande
Aa #5E656E sobre #FAD461 4,11:1 AA, texto grande
Aa #FFF8F2 sobre #469173 3,59:1 AA, texto grande
Aa #E37444 sobre #613321 3,42:1 AA, texto grande
Aa #3A3878 sobre #E37444 3,40:1 AA, texto grande
Aa #0B0A0D sobre #5E656E 3,35:1 AA, texto grande
Aa #0B0A0D sobre #B0305A 3,21:1 AA, texto grande
Aa #FFF8F2 sobre #E37444 2,91:1 No aprobado
Aa #75BAE6 sobre #B0305A 2,90:1 No aprobado
Aa #7BC456 sobre #B0305A 2,89:1 No aprobado
Aa #BAAE95 sobre #B0305A 2,80:1 No aprobado
Aa #5E656E sobre #75BAE6 2,79:1 No aprobado
Aa #5E656E sobre #7BC456 2,77:1 No aprobado
Aa #469173 sobre #613321 2,77:1 No aprobado
Aa #3A3878 sobre #469173 2,76:1 No aprobado
Aa #5E656E sobre #BAAE95 2,69:1 No aprobado
Aa #469173 sobre #FAD461 2,64:1 No aprobado
Aa #FAD461 sobre #E37444 2,14:1 No aprobado
Aa #BAAE95 sobre #FFF8F2 2,08:1 No aprobado
Aa #FFF8F2 sobre #7BC456 2,02:1 No aprobado
Aa #FFF8F2 sobre #75BAE6 2,01:1 No aprobado
Aa #E37444 sobre #B0305A 2,00:1 No aprobado
Aa #5E656E sobre #E37444 1,92:1 No aprobado
Aa #0B0A0D sobre #3A3878 1,90:1 No aprobado
Aa #0B0A0D sobre #613321 1,88:1 No aprobado
Aa #75BAE6 sobre #469173 1,79:1 No aprobado
Aa #5E656E sobre #613321 1,78:1 No aprobado
Aa #469173 sobre #7BC456 1,78:1 No aprobado
Aa #5E656E sobre #3A3878 1,77:1 No aprobado
Aa #BAAE95 sobre #469173 1,72:1 No aprobado
Aa #B0305A sobre #613321 1,71:1 No aprobado
Aa #3A3878 sobre #B0305A 1,69:1 No aprobado
Aa #469173 sobre #B0305A 1,63:1 No aprobado
Aa #5E656E sobre #469173 1,56:1 No aprobado
Aa #BAAE95 sobre #FAD461 1,53:1 No aprobado
Aa #75BAE6 sobre #FAD461 1,48:1 No aprobado
Aa #7BC456 sobre #FAD461 1,48:1 No aprobado
Aa #75BAE6 sobre #E37444 1,45:1 No aprobado
Aa #7BC456 sobre #E37444 1,44:1 No aprobado
Aa #BAAE95 sobre #E37444 1,40:1 No aprobado
Aa #FFF8F2 sobre #FAD461 1,36:1 No aprobado
Aa #469173 sobre #E37444 1,23:1 No aprobado
Aa #5E656E sobre #B0305A 1,04:1 No aprobado
Aa #BAAE95 sobre #75BAE6 1,04:1 No aprobado
Aa #BAAE95 sobre #7BC456 1,03:1 No aprobado
Aa #75BAE6 sobre #7BC456 1,01:1 No aprobado
Aa #3A3878 sobre #613321 1,01: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