Skeletonic Stylus v2.0.0 livre trois palettes de couleurs optionnelles, chacune distribuée sous forme de feuille de style minifiée afin de ne charger que le nécessaire.
| Palette | Fichier | Taille (min) |
|---|---|---|
| Material | dist/css/palettes/material/skeletonic-material.min.css |
≈8 Ko |
| Tachyons | dist/css/palettes/tachyons/skeletonic-tachyons.min.css |
7,3 Ko |
| Web-safe | dist/css/palettes/websafe/skeletonic-websafe.min.css |
≈4 Ko |
Cette page charge la palette Tachyons pour que les classes utilitaires de couleur ci-dessous s'affichent correctement.
Gamme de gris Skeletonic
La feuille de style principale propose une échelle de gris accessible en
11 nuances exposée via --cl-grey-100 … --cl-grey-1000.
Couleurs de marque (v2.0.0 — contraste AA)
Dans la v2.0.0, les jetons primaire et secondaire ont été assombris pour atteindre un contraste WCAG 4,5:1 contre le texte blanc par défaut.
hsl(210 100% 42%)
hsl(195 100% 33%)
#757c8a
Note.
--cl-tertiary(#757c8a) atteint un rapport de contraste de 4.71:1 sur fond blanc — conforme AA pour le texte de grande taille (≥ 18 px gras / ≥ 24 px normal) mais pas pour le corps de texte. Associez-le à des arrière-plans plus sombres ou utilisez-le uniquement pour des éléments décoratifs non essentiels.
Classes utilitaires de la palette Tachyons
En chargeant skeletonic-tachyons.min.css, vous obtenez un ensemble
complet de classes de couleur à usage unique — même artefact livré,
module optionnel.
<span class="bg-blue white pa2">.bg-blue .white</span>
<span class="bg-light-green dark-green pa2">.bg-light-green .dark-green</span>
<span class="bg-washed-yellow dark-gray pa2">.bg-washed-yellow .dark-gray</span>
La spécification complète de la palette Tachyons est documentée sur tachyons.io/docs/themes/skins ; la version livrée ici est celle compilée par Skeletonic.