Criar conta Criar conta
Gas Station 12

Gas Station 12

Paleta de 12 cores · Quente · Escura · Harmonia: Monocromática

Voltar à biblioteca

Gas Station 12

Paleta de 12 cores · Temperatura: Quente · Tonalidade: Escura · Harmonia: Monocromática

Editar
Sóbria 12 cores Quente Escura Monocromática green dark blue cyan
Curtidas 51
Cores 12

Variáveis 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 sóbria de 12 cores vai de Pine Glade (#BABE7C), o tom mais claro, até Matt Black (#151614), o mais escuro. Ela reúne Pine Glade, Mosstone, Savannah Moss, Aged Pine, Woodrush, Karaka, Coco’s Black, Matt Black, Crisp Lettuce, Seiheki Green, Pine Hollow e Ore Bluish Black em um único conjunto que você pode levar direto para uma interface. Dos seus 66 pares de cores, 10 atingem o limiar de contraste WCAG AA (4,5:1) para texto corrido — o mais forte é #BABE7C sobre #151614, com 9,29:1.

Uma paleta versátil para páginas de marketing, blocos hero de produtos, ilustrações e estados de destaque na interface.

Análise das cores

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

Contraste e acessibilidade

10 de 66 pares de cores atingem o limiar de contraste WCAG AA (4,5:1) para texto corrido.

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 Reprovado
Aa #7D825A sobre #203F42 2,82:1 Reprovado
Aa #7D825A sobre #373F34 2,71:1 Reprovado
Aa #1C1C17 sobre #376862 2,70:1 Reprovado
Aa #7D825A sobre #443F2D 2,61:1 Reprovado
Aa #49513E sobre #519585 2,37:1 Reprovado
Aa #49513E sobre #151614 2,19:1 Reprovado
Aa #2F2D22 sobre #376862 2,18:1 Reprovado
Aa #376862 sobre #19343A 2,08:1 Reprovado
Aa #BABE7C sobre #7D825A 2,06:1 Reprovado
Aa #7D825A sobre #49513E 2,06:1 Reprovado
Aa #49513E sobre #1C1C17 2,06:1 Reprovado
Aa #519585 sobre #376862 1,80:1 Reprovado
Aa #BABE7C sobre #519585 1,79:1 Reprovado
Aa #376862 sobre #203F42 1,79:1 Reprovado
Aa #373F34 sobre #376862 1,73:1 Reprovado
Aa #443F2D sobre #151614 1,72:1 Reprovado
Aa #49513E sobre #2F2D22 1,67:1 Reprovado
Aa #373F34 sobre #151614 1,66:1 Reprovado
Aa #443F2D sobre #376862 1,66:1 Reprovado
Aa #443F2D sobre #1C1C17 1,62:1 Reprovado
Aa #151614 sobre #203F42 1,60:1 Reprovado
Aa #49513E sobre #19343A 1,59:1 Reprovado
Aa #7D825A sobre #376862 1,57:1 Reprovado
Aa #373F34 sobre #1C1C17 1,57:1 Reprovado
Aa #1C1C17 sobre #203F42 1,51:1 Reprovado
Aa #151614 sobre #19343A 1,38:1 Reprovado
Aa #49513E sobre #203F42 1,37:1 Reprovado
Aa #49513E sobre #373F34 1,32:1 Reprovado
Aa #49513E sobre #376862 1,31:1 Reprovado
Aa #443F2D sobre #2F2D22 1,31:1 Reprovado
Aa #2F2D22 sobre #151614 1,31:1 Reprovado
Aa #1C1C17 sobre #19343A 1,30:1 Reprovado
Aa #49513E sobre #443F2D 1,27:1 Reprovado
Aa #373F34 sobre #2F2D22 1,27:1 Reprovado
Aa #443F2D sobre #19343A 1,25:1 Reprovado
Aa #2F2D22 sobre #1C1C17 1,24:1 Reprovado
Aa #2F2D22 sobre #203F42 1,22:1 Reprovado
Aa #373F34 sobre #19343A 1,21:1 Reprovado
Aa #203F42 sobre #19343A 1,16:1 Reprovado
Aa #7D825A sobre #519585 1,15:1 Reprovado
Aa #443F2D sobre #203F42 1,08:1 Reprovado
Aa #1C1C17 sobre #151614 1,06:1 Reprovado
Aa #2F2D22 sobre #19343A 1,05:1 Reprovado
Aa #373F34 sobre #443F2D 1,04:1 Reprovado
Aa #373F34 sobre #203F42 1,04:1 Reprovado

Paletas semelhantes

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