Registrarse Registrarse
Flashy 9

Flashy 9

Paleta de 9 colores · Colores cálidos · Tonos mixtos · Armonía complementaria

Volver a la biblioteca

Flashy 9

Paleta de 9 colores · Colores cálidos · Tonos mixtos · Armonía complementaria

Editar
Colores vibrantes 9 colores Colores cálidos Tonos mixtos Armonía complementaria
Me gusta 15
Colores 9

Variables CSS

:root {
  --c-vibrant-1: #0A030D;
  --c-vibrant-2: #FFFFF7;
  --c-vibrant-3: #2CE8F5;
  --c-vibrant-4: #FFCF00;
  --c-vibrant-5: #FF0059;
  --c-vibrant-6: #004D57;
  --c-vibrant-7: #230C45;
  --c-vibrant-8: #7D2160;
  --c-vibrant-9: #2AD726;
}

Sobre esta paleta

Esta paleta de 9 colores vibrantes va de Milk (#FFFFF7), su tono más claro, a Broken Tube (#0A030D), el más oscuro. Combina Broken Tube, Milk, Sparky Blue, Fluorescent Orange, New York Sunset, Deep Atlantic Blue, Shadow Planet, Smooch y First of the Month Green en un solo conjunto que puedes llevar directamente a una interfaz. Combinaciones de colores en la paleta: 36. De ellas, 17 cumplen el umbral de contraste WCAG AA (4,5:1) para texto principal; la de mayor contraste es #0A030D sobre #FFFFF7, con 20,26: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

Broken Tube #0A030D
RGB
rgb(10, 3, 13)
HSL
hsl(282, 63%, 3%)
Luminancia
0,002
Milk #FFFFF7
RGB
rgb(255, 255, 247)
HSL
hsl(60, 100%, 98%)
Luminancia
0,995
Sparky Blue #2CE8F5
RGB
rgb(44, 232, 245)
HSL
hsl(184, 91%, 57%)
Luminancia
0,648
Fluorescent Orange #FFCF00
RGB
rgb(255, 207, 0)
HSL
hsl(49, 100%, 50%)
Luminancia
0,659
New York Sunset #FF0059
RGB
rgb(255, 0, 89)
HSL
hsl(339, 100%, 50%)
Luminancia
0,220
Deep Atlantic Blue #004D57
RGB
rgb(0, 77, 87)
HSL
hsl(187, 100%, 17%)
Luminancia
0,060
Shadow Planet #230C45
RGB
rgb(35, 12, 69)
HSL
hsl(264, 70%, 16%)
Luminancia
0,011
Smooch #7D2160
RGB
rgb(125, 33, 96)
HSL
hsl(319, 58%, 31%)
Luminancia
0,063
First of the Month Green #2AD726
RGB
rgb(42, 215, 38)
HSL
hsl(119, 70%, 50%)
Luminancia
0,492

Contraste y accesibilidad

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

Aa #0A030D sobre #FFFFF7 20,26:1 AAA
Aa #FFFFF7 sobre #230C45 17,27:1 AAA
Aa #0A030D sobre #FFCF00 13,74:1 AAA
Aa #0A030D sobre #2CE8F5 13,54:1 AAA
Aa #FFCF00 sobre #230C45 11,72:1 AAA
Aa #2CE8F5 sobre #230C45 11,54:1 AAA
Aa #0A030D sobre #2AD726 10,51:1 AAA
Aa #FFFFF7 sobre #004D57 9,50:1 AAA
Aa #FFFFF7 sobre #7D2160 9,25:1 AAA
Aa #230C45 sobre #2AD726 8,96:1 AAA
Aa #FFCF00 sobre #004D57 6,45:1 AA
Aa #2CE8F5 sobre #004D57 6,35:1 AA
Aa #FFCF00 sobre #7D2160 6,28:1 AA
Aa #2CE8F5 sobre #7D2160 6,18:1 AA
Aa #0A030D sobre #FF0059 5,23:1 AA
Aa #004D57 sobre #2AD726 4,93:1 AA
Aa #7D2160 sobre #2AD726 4,80:1 AA
Aa #FF0059 sobre #230C45 4,46:1 AA, texto grande
Aa #FFFFF7 sobre #FF0059 3,87:1 AA, texto grande
Aa #FFCF00 sobre #FF0059 2,63:1 No aprobado
Aa #2CE8F5 sobre #FF0059 2,59:1 No aprobado
Aa #FF0059 sobre #004D57 2,45:1 No aprobado
Aa #FF0059 sobre #7D2160 2,39:1 No aprobado
Aa #0A030D sobre #7D2160 2,19:1 No aprobado
Aa #0A030D sobre #004D57 2,13:1 No aprobado
Aa #FF0059 sobre #2AD726 2,01:1 No aprobado
Aa #FFFFF7 sobre #2AD726 1,93:1 No aprobado
Aa #230C45 sobre #7D2160 1,87:1 No aprobado
Aa #004D57 sobre #230C45 1,82:1 No aprobado
Aa #FFFFF7 sobre #2CE8F5 1,50:1 No aprobado
Aa #FFFFF7 sobre #FFCF00 1,47:1 No aprobado
Aa #FFCF00 sobre #2AD726 1,31:1 No aprobado
Aa #2CE8F5 sobre #2AD726 1,29:1 No aprobado
Aa #0A030D sobre #230C45 1,17:1 No aprobado
Aa #004D57 sobre #7D2160 1,03:1 No aprobado
Aa #2CE8F5 sobre #FFCF00 1,01:1 No aprobado

Paletas similares

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