Paleta de grisos
La paleta de grisos defineix una escala de colors neutres per aplicar en textos, fons, línies divisòries, marcs i altres elements funcionals de la interfície. Els diferents tons d’aquesta escala serveixen per establir jerarquies visuals, contrastos suaus i fons neutres.
Colors de la paleta de grisos
Exosfera
#111111
hsl(0, 0%, 7%)
rgb(17, 17, 17)
(--color-negre)
Color negre base que s’hauria d’utilitzar en la major part dels textos que no requereixin èmfasi o funcions específiques (per exemple: text principal, paràgrafs, llistes).
Pissarra
#2a3037
hsl(212, 13%, 19%)
rgb(42, 48, 55)
(--color-gris-85)
Color d’interfície.
Àncora
#434b56
hsl(215, 13%, 30%)
rgb(67, 75, 86)
(--color-gris-70)
Color d’interfície.
Tauró
#596473
hsl(215, 13%, 40%)
rgb(89, 100, 115)
(--color-gris-60)
Color d’interfície.
Colom
#7e8a9a
hsl(215, 12%, 55%)
rgb(126, 138, 154)
(--color-gris-45)
Color d’interfície.
Cendra
#a9b1bc
hsl(215, 12%, 70%)
rgb(169, 177, 188)
(--color-gris-30)
Color d’interfície.
Columna
#d4d8de
hsl(216, 13%, 85%)
rgb(212, 216, 222)
(--color-gris-15)
Color de línies separadores o de fons per blocs de text que calgui ressaltar amb un color neutre.
Boira
#f1f2f4
hsl(220, 11%, 95%)
rgb(241, 242, 244)
(--color-gris-5)
Color de línies separadores o de fons per blocs de text que calgui ressaltar amb un color neutre.
Coco
#ffffff
hsl(0, 0%, 100%)
rgb(255, 255, 255)
(--color-blanc)
Color de fons per defecte.
Usos correcte i incorrectes
Tot i que la paleta de colors web es basa principalment en el verd Campus, el color predominant en la majoria de dissenys hauria de ser el blanc. L’ús generós d’espai en blanc afavoreix una comunicació clara i moderna, i ajuda a centrar l’atenció en la informació essencial.
Com a norma general:
- El text principal hauria de ser en negre Exosfera, per garantir una màxima llegibilitat.
- El fons de les pàgines i seccions hauria de ser blanc Coco.
- Tons foscos com Pissarra o Àncora es poden utilitzar puntualment com a color de fons per blocs destacats, capçaleres, peus de pàgina o seccions. En aquests casos, el text ha de ser blanc.
- Tons clars com Columna o Boira són útils per ressaltar suaument elements de la interfície com targetes, formularis, cel·les de taules o seccions amb un fons alternatiu. Cal verificar sempre que el contrast amb el text sigui suficient.
