ABYSS 9

ABYSS 9

Paleta de 9 colores · Colores fríos · Tonos mixtos · Armonía triádica

ABYSS 9

Paleta de 9 colores · Colores fríos · Tonos mixtos · Armonía triádica

Editar
Colores apagados 9 colores Colores fríos Tonos mixtos Armonía triádica cool glow ramp smooth
Me gusta 376
Colores 9


Variables CSS

:root {
  --c-muted-1: #000000;
  --c-muted-2: #1F123A;
  --c-muted-3: #3A1E7E;
  --c-muted-4: #5429C2;
  --c-muted-5: #5463D9;
  --c-muted-6: #62AADD;
  --c-muted-7: #7FE3DC;
  --c-muted-8: #A0F5C6;
  --c-muted-9: #DDF8D0;
}

Sobre esta paleta

Esta paleta de 9 colores apagados va de Aquarelle Mint (#DDF8D0), su tono más claro, a Black (#000000), el más oscuro. Combina Black, Blacklist, Explorer of the Galaxies, Blue Purple, Thick Blue, Acapulco Dive, Cold Blue, Nightly Aurora y Aquarelle Mint en un solo conjunto que puedes llevar directamente a una interfaz. Combinaciones de colores en la paleta: 36. De ellas, 15 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal; la de mayor contraste es #000000 sobre #DDF8D0, con 18,41: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

Black #000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
Luminancia
0,000
Blacklist #1F123A
RGB
rgb(31, 18, 58)
HSL
hsl(260, 53%, 15%)
Luminancia
0,010
Explorer of the Galaxies #3A1E7E
RGB
rgb(58, 30, 126)
HSL
hsl(258, 62%, 31%)
Luminancia
0,033
Blue Purple #5429C2
RGB
rgb(84, 41, 194)
HSL
hsl(257, 65%, 46%)
Luminancia
0,074
Thick Blue #5463D9
RGB
rgb(84, 99, 217)
HSL
hsl(233, 64%, 59%)
Luminancia
0,158
Acapulco Dive #62AADD
RGB
rgb(98, 170, 221)
HSL
hsl(205, 64%, 63%)
Luminancia
0,366
Cold Blue #7FE3DC
RGB
rgb(127, 227, 220)
HSL
hsl(176, 64%, 69%)
Luminancia
0,646
Nightly Aurora #A0F5C6
RGB
rgb(160, 245, 198)
HSL
hsl(147, 81%, 79%)
Luminancia
0,769
Aquarelle Mint #DDF8D0
RGB
rgb(221, 248, 208)
HSL
hsl(101, 74%, 89%)
Luminancia
0,871

Contraste y accesibilidad

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

Aa #000000 sobre #DDF8D0 18,41:1 AAA
Aa #000000 sobre #A0F5C6 16,37:1 AAA
Aa #1F123A sobre #DDF8D0 15,27:1 AAA
Aa #000000 sobre #7FE3DC 13,92:1 AAA
Aa #1F123A sobre #A0F5C6 13,58:1 AAA
Aa #1F123A sobre #7FE3DC 11,55:1 AAA
Aa #3A1E7E sobre #DDF8D0 11,05:1 AAA
Aa #3A1E7E sobre #A0F5C6 9,82:1 AAA
Aa #3A1E7E sobre #7FE3DC 8,35:1 AAA
Aa #000000 sobre #62AADD 8,31:1 AAA
Aa #5429C2 sobre #DDF8D0 7,44:1 AAA
Aa #1F123A sobre #62AADD 6,89:1 AA
Aa #5429C2 sobre #A0F5C6 6,62:1 AA
Aa #5429C2 sobre #7FE3DC 5,63:1 AA
Aa #3A1E7E sobre #62AADD 4,99:1 AA
Aa #5463D9 sobre #DDF8D0 4,42:1 AA, texto grande
Aa #000000 sobre #5463D9 4,16:1 AA, texto grande
Aa #5463D9 sobre #A0F5C6 3,93:1 AA, texto grande
Aa #1F123A sobre #5463D9 3,45:1 AA, texto grande
Aa #5429C2 sobre #62AADD 3,36:1 AA, texto grande
Aa #5463D9 sobre #7FE3DC 3,34:1 AA, texto grande
Aa #3A1E7E sobre #5463D9 2,50:1 No aprobado
Aa #000000 sobre #5429C2 2,47:1 No aprobado
Aa #62AADD sobre #DDF8D0 2,21:1 No aprobado
Aa #1F123A sobre #5429C2 2,05:1 No aprobado
Aa #5463D9 sobre #62AADD 2,00:1 No aprobado
Aa #62AADD sobre #A0F5C6 1,97:1 No aprobado
Aa #5429C2 sobre #5463D9 1,68:1 No aprobado
Aa #000000 sobre #3A1E7E 1,67:1 No aprobado
Aa #62AADD sobre #7FE3DC 1,67:1 No aprobado
Aa #3A1E7E sobre #5429C2 1,48:1 No aprobado
Aa #1F123A sobre #3A1E7E 1,38:1 No aprobado
Aa #7FE3DC sobre #DDF8D0 1,32:1 No aprobado
Aa #000000 sobre #1F123A 1,21:1 No aprobado
Aa #7FE3DC sobre #A0F5C6 1,18:1 No aprobado
Aa #A0F5C6 sobre #DDF8D0 1,12:1 No aprobado

Paletas similares

#222831 #393E46 #00ADB5 #EEEEEE
4 colores
#F9F7F7 #DBE2EF #3F72AF #112D4E
4 colores
#1B262C #0F4C75 #3282B8 #BBE1FA
4 colores
#08D9D6 #252A34 #FF2E63 #EAEAEA
4 colores
#27374D #526D82 #9DB2BF #DDE6ED
4 colores
#364F6B #3FC1C9 #F5F5F5 #FC5185
4 colores
#E4F9F5 #30E3CA #11999E #40514E
4 colores
#F0F5F9 #C9D6DF #52616B #1E2022
4 colores