Registrarse Registrarse
Gas Station 12

Gas Station 12

Paleta de 12 colores · Colores cálidos · Tonos oscuros · Armonía monocromática

Volver a la biblioteca

Gas Station 12

Paleta de 12 colores · Colores cálidos · Tonos oscuros · Armonía monocromática

Editar
Colores apagados 12 colores Colores cálidos Tonos oscuros Armonía monocromática green dark blue cyan
Me gusta 51
Colores 12

Variables CSS

:root {
  --c-muted-1: #BABE7C;
  --c-muted-2: #7D825A;
  --c-muted-3: #49513E;
  --c-muted-4: #373F34;
  --c-muted-5: #443F2D;
  --c-muted-6: #2F2D22;
  --c-muted-7: #1C1C17;
  --c-muted-8: #151614;
  --c-muted-9: #519585;
  --c-muted-10: #376862;
  --c-muted-11: #203F42;
  --c-muted-12: #19343A;
}

Sobre esta paleta

Esta paleta de 12 colores apagados va de Pine Glade (#BABE7C), su tono más claro, a Matt Black (#151614), el más oscuro. Combina Pine Glade, Mosstone, Savannah Moss, Aged Pine, Woodrush, Karaka, Coco’s Black, Matt Black, Crisp Lettuce, Seiheki Green, Pine Hollow y Ore Bluish Black en un solo conjunto que puedes llevar directamente a una interfaz. Combinaciones de colores en la paleta: 66. De ellas, 10 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal; la de mayor contraste es #BABE7C sobre #151614, con 9,29: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

Pine Glade #BABE7C
RGB
rgb(186, 190, 124)
HSL
hsl(64, 34%, 62%)
Luminancia
0,487
Mosstone #7D825A
RGB
rgb(125, 130, 90)
HSL
hsl(68, 18%, 43%)
Luminancia
0,211
Savannah Moss #49513E
RGB
rgb(73, 81, 62)
HSL
hsl(85, 13%, 28%)
Luminancia
0,077
Aged Pine #373F34
RGB
rgb(55, 63, 52)
HSL
hsl(104, 10%, 23%)
Luminancia
0,046
Woodrush #443F2D
RGB
rgb(68, 63, 45)
HSL
hsl(47, 20%, 22%)
Luminancia
0,050
Karaka #2F2D22
RGB
rgb(47, 45, 34)
HSL
hsl(51, 16%, 16%)
Luminancia
0,026
Coco’s Black #1C1C17
RGB
rgb(28, 28, 23)
HSL
hsl(60, 10%, 10%)
Luminancia
0,011
Matt Black #151614
RGB
rgb(21, 22, 20)
HSL
hsl(90, 5%, 8%)
Luminancia
0,008
Crisp Lettuce #519585
RGB
rgb(81, 149, 133)
HSL
hsl(166, 30%, 45%)
Luminancia
0,249
Seiheki Green #376862
RGB
rgb(55, 104, 98)
HSL
hsl(173, 31%, 31%)
Luminancia
0,116
Pine Hollow #203F42
RGB
rgb(32, 63, 66)
HSL
hsl(185, 35%, 19%)
Luminancia
0,043
Ore Bluish Black #19343A
RGB
rgb(25, 52, 58)
HSL
hsl(191, 40%, 16%)
Luminancia
0,030

Contraste y accesibilidad

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

Aa #BABE7C sobre #151614 9,29:1 AAA
Aa #BABE7C sobre #1C1C17 8,75:1 AAA
Aa #BABE7C sobre #2F2D22 7,07:1 AAA
Aa #BABE7C sobre #19343A 6,74:1 AA
Aa #BABE7C sobre #203F42 5,80:1 AA
Aa #BABE7C sobre #373F34 5,59:1 AA
Aa #BABE7C sobre #443F2D 5,39:1 AA
Aa #151614 sobre #519585 5,18:1 AA
Aa #1C1C17 sobre #519585 4,88:1 AA
Aa #7D825A sobre #151614 4,51:1 AA
Aa #BABE7C sobre #49513E 4,25:1 AA, texto grande
Aa #7D825A sobre #1C1C17 4,25:1 AA, texto grande
Aa #2F2D22 sobre #519585 3,94:1 AA, texto grande
Aa #519585 sobre #19343A 3,76:1 AA, texto grande
Aa #7D825A sobre #2F2D22 3,43:1 AA, texto grande
Aa #7D825A sobre #19343A 3,27:1 AA, texto grande
Aa #BABE7C sobre #376862 3,24:1 AA, texto grande
Aa #519585 sobre #203F42 3,23:1 AA, texto grande
Aa #373F34 sobre #519585 3,11:1 AA, texto grande
Aa #443F2D sobre #519585 3,00:1 AA, texto grande
Aa #151614 sobre #376862 2,87:1 No aprobado
Aa #7D825A sobre #203F42 2,82:1 No aprobado
Aa #7D825A sobre #373F34 2,71:1 No aprobado
Aa #1C1C17 sobre #376862 2,70:1 No aprobado
Aa #7D825A sobre #443F2D 2,61:1 No aprobado
Aa #49513E sobre #519585 2,37:1 No aprobado
Aa #49513E sobre #151614 2,19:1 No aprobado
Aa #2F2D22 sobre #376862 2,18:1 No aprobado
Aa #376862 sobre #19343A 2,08:1 No aprobado
Aa #BABE7C sobre #7D825A 2,06:1 No aprobado
Aa #7D825A sobre #49513E 2,06:1 No aprobado
Aa #49513E sobre #1C1C17 2,06:1 No aprobado
Aa #519585 sobre #376862 1,80:1 No aprobado
Aa #BABE7C sobre #519585 1,79:1 No aprobado
Aa #376862 sobre #203F42 1,79:1 No aprobado
Aa #373F34 sobre #376862 1,73:1 No aprobado
Aa #443F2D sobre #151614 1,72:1 No aprobado
Aa #49513E sobre #2F2D22 1,67:1 No aprobado
Aa #373F34 sobre #151614 1,66:1 No aprobado
Aa #443F2D sobre #376862 1,66:1 No aprobado
Aa #443F2D sobre #1C1C17 1,62:1 No aprobado
Aa #151614 sobre #203F42 1,60:1 No aprobado
Aa #49513E sobre #19343A 1,59:1 No aprobado
Aa #7D825A sobre #376862 1,57:1 No aprobado
Aa #373F34 sobre #1C1C17 1,57:1 No aprobado
Aa #1C1C17 sobre #203F42 1,51:1 No aprobado
Aa #151614 sobre #19343A 1,38:1 No aprobado
Aa #49513E sobre #203F42 1,37:1 No aprobado
Aa #49513E sobre #373F34 1,32:1 No aprobado
Aa #49513E sobre #376862 1,31:1 No aprobado
Aa #443F2D sobre #2F2D22 1,31:1 No aprobado
Aa #2F2D22 sobre #151614 1,31:1 No aprobado
Aa #1C1C17 sobre #19343A 1,30:1 No aprobado
Aa #49513E sobre #443F2D 1,27:1 No aprobado
Aa #373F34 sobre #2F2D22 1,27:1 No aprobado
Aa #443F2D sobre #19343A 1,25:1 No aprobado
Aa #2F2D22 sobre #1C1C17 1,24:1 No aprobado
Aa #2F2D22 sobre #203F42 1,22:1 No aprobado
Aa #373F34 sobre #19343A 1,21:1 No aprobado
Aa #203F42 sobre #19343A 1,16:1 No aprobado
Aa #7D825A sobre #519585 1,15:1 No aprobado
Aa #443F2D sobre #203F42 1,08:1 No aprobado
Aa #1C1C17 sobre #151614 1,06:1 No aprobado
Aa #2F2D22 sobre #19343A 1,05:1 No aprobado
Aa #373F34 sobre #443F2D 1,04:1 No aprobado
Aa #373F34 sobre #203F42 1,04:1 No aprobado

Paletas similares

#000000 #3D0000 #950101 #FF0000
4 colores
#E23E57 #88304E #522546 #311D3F
4 colores
#FF204E #A0153E #5D0E41 #00224D
4 colores
#030637 #3C0753 #720455 #910A67
4 colores
#1C0A00 #361500 #603601 #CC9544
4 colores
#252525 #FF0000 #AF0404 #414141
4 colores
#362222 #171010 #423F3E #2B2B2B
4 colores
#1A1A1D #3B1C32 #6A1E55 #A64D79
4 colores