Registrarse Registrarse
Nebulosa !

Nebulosa !

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

Volver a la biblioteca

Nebulosa !

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

Editar
Colores vibrantes 12 colores Colores fríos Tonos mixtos Armonía triádica pixelart nebula space
Me gusta 100
Colores 12

Variables CSS

:root {
  --c-vibrant-1: #221569;
  --c-vibrant-2: #3B2799;
  --c-vibrant-3: #4A2ECA;
  --c-vibrant-4: #A83CF0;
  --c-vibrant-5: #DB3CF0;
  --c-vibrant-6: #F465EE;
  --c-vibrant-7: #B5E6FF;
  --c-vibrant-8: #84D5FE;
  --c-vibrant-9: #4EC0E8;
  --c-vibrant-10: #4EA3DC;
  --c-vibrant-11: #3187D4;
  --c-vibrant-12: #314AD4;
}

Sobre esta paleta

Esta paleta de 12 colores vibrantes va de Frozen Landscape (#B5E6FF), su tono más claro, a Ocean Abyss (#221569), el más oscuro. Combina Ocean Abyss, Gentian Blue, Grape Hyacinth, Sweet Desire, Apple II Magenta, Pink Ping, Frozen Landscape, Kul Sharif Blue, Clean Pool, Waimea Blue, Soothing Sapphire y New Car en un solo conjunto que puedes llevar directamente a una interfaz. Combinaciones de colores en la paleta: 66. De ellas, 11 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal; la de mayor contraste es #221569 sobre #B5E6FF, con 11,4: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

Ocean Abyss #221569
RGB
rgb(34, 21, 105)
HSL
hsl(249, 67%, 25%)
Luminancia
0,019
Gentian Blue #3B2799
RGB
rgb(59, 39, 153)
HSL
hsl(251, 59%, 38%)
Luminancia
0,047
Grape Hyacinth #4A2ECA
RGB
rgb(74, 46, 202)
HSL
hsl(251, 63%, 49%)
Luminancia
0,077
Sweet Desire #A83CF0
RGB
rgb(168, 60, 240)
HSL
hsl(276, 86%, 59%)
Luminancia
0,179
Apple II Magenta #DB3CF0
RGB
rgb(219, 60, 240)
HSL
hsl(293, 86%, 59%)
Luminancia
0,246
Pink Ping #F465EE
RGB
rgb(244, 101, 238)
HSL
hsl(303, 87%, 68%)
Luminancia
0,347
Frozen Landscape #B5E6FF
RGB
rgb(181, 230, 255)
HSL
hsl(200, 100%, 85%)
Luminancia
0,736
Kul Sharif Blue #84D5FE
RGB
rgb(132, 213, 254)
HSL
hsl(200, 98%, 76%)
Luminancia
0,597
Clean Pool #4EC0E8
RGB
rgb(78, 192, 232)
HSL
hsl(196, 77%, 61%)
Luminancia
0,452
Waimea Blue #4EA3DC
RGB
rgb(78, 163, 220)
HSL
hsl(204, 67%, 58%)
Luminancia
0,330
Soothing Sapphire #3187D4
RGB
rgb(49, 135, 212)
HSL
hsl(208, 65%, 51%)
Luminancia
0,227
New Car #314AD4
RGB
rgb(49, 74, 212)
HSL
hsl(231, 65%, 51%)
Luminancia
0,103

Contraste y accesibilidad

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

Aa #221569 sobre #B5E6FF 11,40:1 AAA
Aa #221569 sobre #84D5FE 9,37:1 AAA
Aa #3B2799 sobre #B5E6FF 8,12:1 AAA
Aa #221569 sobre #4EC0E8 7,27:1 AAA
Aa #3B2799 sobre #84D5FE 6,68:1 AA
Aa #4A2ECA sobre #B5E6FF 6,20:1 AA
Aa #221569 sobre #F465EE 5,76:1 AA
Aa #221569 sobre #4EA3DC 5,51:1 AA
Aa #3B2799 sobre #4EC0E8 5,18:1 AA
Aa #B5E6FF sobre #314AD4 5,14:1 AA
Aa #4A2ECA sobre #84D5FE 5,10:1 AA
Aa #221569 sobre #DB3CF0 4,29:1 AA, texto grande
Aa #84D5FE sobre #314AD4 4,22:1 AA, texto grande
Aa #3B2799 sobre #F465EE 4,10:1 AA, texto grande
Aa #221569 sobre #3187D4 4,02:1 AA, texto grande
Aa #4A2ECA sobre #4EC0E8 3,96:1 AA, texto grande
Aa #3B2799 sobre #4EA3DC 3,92:1 AA, texto grande
Aa #A83CF0 sobre #B5E6FF 3,44:1 AA, texto grande
Aa #221569 sobre #A83CF0 3,31:1 AA, texto grande
Aa #4EC0E8 sobre #314AD4 3,28:1 AA, texto grande
Aa #4A2ECA sobre #F465EE 3,13:1 AA, texto grande
Aa #3B2799 sobre #DB3CF0 3,06:1 AA, texto grande
Aa #4A2ECA sobre #4EA3DC 3,00:1 AA, texto grande
Aa #3B2799 sobre #3187D4 2,86:1 No aprobado
Aa #B5E6FF sobre #3187D4 2,84:1 No aprobado
Aa #A83CF0 sobre #84D5FE 2,83:1 No aprobado
Aa #DB3CF0 sobre #B5E6FF 2,66:1 No aprobado
Aa #F465EE sobre #314AD4 2,59:1 No aprobado
Aa #4EA3DC sobre #314AD4 2,48:1 No aprobado
Aa #3B2799 sobre #A83CF0 2,36:1 No aprobado
Aa #4A2ECA sobre #DB3CF0 2,33:1 No aprobado
Aa #84D5FE sobre #3187D4 2,33:1 No aprobado
Aa #221569 sobre #314AD4 2,22:1 No aprobado
Aa #4A2ECA sobre #3187D4 2,19:1 No aprobado
Aa #A83CF0 sobre #4EC0E8 2,19:1 No aprobado
Aa #DB3CF0 sobre #84D5FE 2,19:1 No aprobado
Aa #B5E6FF sobre #4EA3DC 2,07:1 No aprobado
Aa #F465EE sobre #B5E6FF 1,98:1 No aprobado
Aa #DB3CF0 sobre #314AD4 1,93:1 No aprobado
Aa #221569 sobre #4A2ECA 1,84:1 No aprobado
Aa #4EC0E8 sobre #3187D4 1,81:1 No aprobado
Aa #3187D4 sobre #314AD4 1,81:1 No aprobado
Aa #4A2ECA sobre #A83CF0 1,80:1 No aprobado
Aa #A83CF0 sobre #F465EE 1,74:1 No aprobado
Aa #DB3CF0 sobre #4EC0E8 1,70:1 No aprobado
Aa #84D5FE sobre #4EA3DC 1,70:1 No aprobado
Aa #A83CF0 sobre #4EA3DC 1,66:1 No aprobado
Aa #F465EE sobre #84D5FE 1,63:1 No aprobado
Aa #3B2799 sobre #314AD4 1,58:1 No aprobado
Aa #B5E6FF sobre #4EC0E8 1,57:1 No aprobado
Aa #A83CF0 sobre #314AD4 1,49:1 No aprobado
Aa #F465EE sobre #3187D4 1,43:1 No aprobado
Aa #221569 sobre #3B2799 1,40:1 No aprobado
Aa #4EA3DC sobre #3187D4 1,37:1 No aprobado
Aa #DB3CF0 sobre #F465EE 1,34:1 No aprobado
Aa #4EC0E8 sobre #4EA3DC 1,32:1 No aprobado
Aa #3B2799 sobre #4A2ECA 1,31:1 No aprobado
Aa #A83CF0 sobre #DB3CF0 1,29:1 No aprobado
Aa #84D5FE sobre #4EC0E8 1,29:1 No aprobado
Aa #DB3CF0 sobre #4EA3DC 1,28:1 No aprobado
Aa #F465EE sobre #4EC0E8 1,26:1 No aprobado
Aa #B5E6FF sobre #84D5FE 1,22:1 No aprobado
Aa #4A2ECA sobre #314AD4 1,21:1 No aprobado
Aa #A83CF0 sobre #3187D4 1,21:1 No aprobado
Aa #DB3CF0 sobre #3187D4 1,07:1 No aprobado
Aa #F465EE sobre #4EA3DC 1,05: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