Brite12

Brite12

Paleta de 12 cores · Quente · Mista · Harmonia: Complementar

Brite12

Paleta de 12 cores · Temperatura: Quente · Tonalidade: Mista · Harmonia: Complementar

Editar
Vibrante 12 cores Quente Mista Complementar 12colors brightcolors
Curtidas 10
Cores 12


Variáveis CSS

:root {
  --c-vibrant-1: #D30935;
  --c-vibrant-2: #FB8C1A;
  --c-vibrant-3: #F8E930;
  --c-vibrant-4: #0EA145;
  --c-vibrant-5: #17B1F3;
  --c-vibrant-6: #0B2FDD;
  --c-vibrant-7: #5B00AF;
  --c-vibrant-8: #FE4AD3;
  --c-vibrant-9: #EAE9E5;
  --c-vibrant-10: #6F7C9A;
  --c-vibrant-11: #031133;
  --c-vibrant-12: #874501;
}

Sobre esta paleta

Esta paleta vibrante de 12 cores vai de Blanco (#EAE9E5), o tom mais claro, até Squid’s Ink (#031133), o mais escuro. Ela reúne Cherry, Laddu Orange, Banana Bombshell, Boogie Blast, Zima Blue, Cold Pack, Aubergine Perl, Mat Dazzle Rose, Blanco, Infinity and Beyond, Squid’s Ink e Chocolate Pancakes em um único conjunto que você pode levar direto para uma interface. Dos seus 66 pares de cores, 12 atingem o limiar de contraste WCAG AA (4,5:1) para texto corrido — o mais forte é #EAE9E5 sobre #031133, com 15,27: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

Cherry #D30935
RGB
rgb(211, 9, 53)
HSL
hsl(347, 92%, 43%)
Luminância
0,143
Laddu Orange #FB8C1A
RGB
rgb(251, 140, 26)
HSL
hsl(30, 97%, 54%)
Luminância
0,393
Banana Bombshell #F8E930
RGB
rgb(248, 233, 48)
HSL
hsl(56, 93%, 58%)
Luminância
0,785
Boogie Blast #0EA145
RGB
rgb(14, 161, 69)
HSL
hsl(142, 84%, 34%)
Luminância
0,260
Zima Blue #17B1F3
RGB
rgb(23, 177, 243)
HSL
hsl(198, 90%, 52%)
Luminância
0,381
Cold Pack #0B2FDD
RGB
rgb(11, 47, 221)
HSL
hsl(230, 91%, 45%)
Luminância
0,073
Aubergine Perl #5B00AF
RGB
rgb(91, 0, 175)
HSL
hsl(271, 100%, 34%)
Luminância
0,053
Mat Dazzle Rose #FE4AD3
RGB
rgb(254, 74, 211)
HSL
hsl(314, 99%, 64%)
Luminância
0,307
Blanco #EAE9E5
RGB
rgb(234, 233, 229)
HSL
hsl(48, 11%, 91%)
Luminância
0,814
Infinity and Beyond #6F7C9A
RGB
rgb(111, 124, 154)
HSL
hsl(222, 18%, 52%)
Luminância
0,201
Squid’s Ink #031133
RGB
rgb(3, 17, 51)
HSL
hsl(223, 89%, 11%)
Luminância
0,007
Chocolate Pancakes #874501
RGB
rgb(135, 69, 1)
HSL
hsl(30, 99%, 27%)
Luminância
0,094

Contraste e acessibilidade

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

Aa #EAE9E5 sobre #031133 15,27:1 AAA
Aa #F8E930 sobre #031133 14,75:1 AAA
Aa #5B00AF sobre #EAE9E5 8,38:1 AAA
Aa #F8E930 sobre #5B00AF 8,09:1 AAA
Aa #FB8C1A sobre #031133 7,83:1 AAA
Aa #17B1F3 sobre #031133 7,62:1 AAA
Aa #0B2FDD sobre #EAE9E5 7,01:1 AAA
Aa #F8E930 sobre #0B2FDD 6,77:1 AA
Aa #FE4AD3 sobre #031133 6,30:1 AA
Aa #EAE9E5 sobre #874501 6,00:1 AA
Aa #F8E930 sobre #874501 5,79:1 AA
Aa #0EA145 sobre #031133 5,48:1 AA
Aa #D30935 sobre #EAE9E5 4,48:1 AA, texto grande
Aa #6F7C9A sobre #031133 4,44:1 AA, texto grande
Aa #D30935 sobre #F8E930 4,32:1 AA, texto grande
Aa #FB8C1A sobre #5B00AF 4,30:1 AA, texto grande
Aa #17B1F3 sobre #5B00AF 4,18:1 AA, texto grande
Aa #FB8C1A sobre #0B2FDD 3,60:1 AA, texto grande
Aa #17B1F3 sobre #0B2FDD 3,50:1 AA, texto grande
Aa #5B00AF sobre #FE4AD3 3,46:1 AA, texto grande
Aa #EAE9E5 sobre #6F7C9A 3,44:1 AA, texto grande
Aa #D30935 sobre #031133 3,41:1 AA, texto grande
Aa #F8E930 sobre #6F7C9A 3,32:1 AA, texto grande
Aa #FB8C1A sobre #874501 3,08:1 AA, texto grande
Aa #0EA145 sobre #5B00AF 3,01:1 AA, texto grande
Aa #17B1F3 sobre #874501 2,99:1 Reprovado
Aa #0B2FDD sobre #FE4AD3 2,89:1 Reprovado
Aa #0EA145 sobre #EAE9E5 2,79:1 Reprovado
Aa #F8E930 sobre #0EA145 2,69:1 Reprovado
Aa #031133 sobre #874501 2,55:1 Reprovado
Aa #0EA145 sobre #0B2FDD 2,52:1 Reprovado
Aa #FE4AD3 sobre #874501 2,48:1 Reprovado
Aa #5B00AF sobre #6F7C9A 2,44:1 Reprovado
Aa #FE4AD3 sobre #EAE9E5 2,42:1 Reprovado
Aa #F8E930 sobre #FE4AD3 2,34:1 Reprovado
Aa #D30935 sobre #FB8C1A 2,30:1 Reprovado
Aa #D30935 sobre #17B1F3 2,23:1 Reprovado
Aa #0B2FDD sobre #031133 2,18:1 Reprovado
Aa #0EA145 sobre #874501 2,15:1 Reprovado
Aa #0B2FDD sobre #6F7C9A 2,04:1 Reprovado
Aa #17B1F3 sobre #EAE9E5 2,01:1 Reprovado
Aa #FB8C1A sobre #EAE9E5 1,95:1 Reprovado
Aa #F8E930 sobre #17B1F3 1,94:1 Reprovado
Aa #FB8C1A sobre #F8E930 1,88:1 Reprovado
Aa #D30935 sobre #5B00AF 1,87:1 Reprovado
Aa #D30935 sobre #FE4AD3 1,85:1 Reprovado
Aa #5B00AF sobre #031133 1,82:1 Reprovado
Aa #FB8C1A sobre #6F7C9A 1,76:1 Reprovado
Aa #6F7C9A sobre #874501 1,74:1 Reprovado
Aa #17B1F3 sobre #6F7C9A 1,72:1 Reprovado
Aa #D30935 sobre #0EA145 1,61:1 Reprovado
Aa #D30935 sobre #0B2FDD 1,57:1 Reprovado
Aa #FB8C1A sobre #0EA145 1,43:1 Reprovado
Aa #FE4AD3 sobre #6F7C9A 1,42:1 Reprovado
Aa #5B00AF sobre #874501 1,40:1 Reprovado
Aa #0EA145 sobre #17B1F3 1,39:1 Reprovado
Aa #D30935 sobre #874501 1,34:1 Reprovado
Aa #D30935 sobre #6F7C9A 1,30:1 Reprovado
Aa #FB8C1A sobre #FE4AD3 1,24:1 Reprovado
Aa #0EA145 sobre #6F7C9A 1,23:1 Reprovado
Aa #17B1F3 sobre #FE4AD3 1,21:1 Reprovado
Aa #0B2FDD sobre #5B00AF 1,19:1 Reprovado
Aa #0B2FDD sobre #874501 1,17:1 Reprovado
Aa #0EA145 sobre #FE4AD3 1,15:1 Reprovado
Aa #F8E930 sobre #EAE9E5 1,04:1 Reprovado
Aa #FB8C1A sobre #17B1F3 1,03:1 Reprovado

Paletas semelhantes

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