Skeletonic Stylus v2.0.0 levert drie optionele kleurenpaletten, elk gedistribueerd als een eigen geminificeerd stylesheet zodat je alleen betaalt voor wat je gebruikt.
| Palet | Bestand | Grootte (min) |
|---|---|---|
| Material | dist/css/palettes/material/skeletonic-material.min.css |
≈17.4 KB |
| Tachyons | dist/css/palettes/tachyons/skeletonic-tachyons.min.css |
7,3 KB |
| Webveilig | dist/css/palettes/websafe/skeletonic-websafe.min.css |
≈3.5 KB |
Deze pagina laadt het Tachyons-palet zodat de kleur-utilityklassen hieronder correct worden weergegeven.
Skeletonic core-grijstinten
Het kernstylesheet levert een toegankelijke 11-staps grijsschaal, beschikbaar
als --cl-grey-100 … --cl-grey-1000.
Merkkleuren (v2.0.0 — AA-contrast)
In v2.0.0 zijn de primaire en secundaire tokens donkerder gemaakt om WCAG 4.5:1 contrast tegen witte tekst standaard te halen.
hsl(210 100% 42%)
hsl(195 100% 33%)
#757c8a
Let op.
--cl-tertiary(#757c8a) behaalt een contrastverhouding van 4.71:1 ten opzichte van wit — AA-conform voor grote tekst (≥ 18 px vet / ≥ 24 px normaal) maar niet voor lopende tekst. Combineer het met donkerdere achtergronden of gebruik het alleen voor niet-essentiële decoratieve elementen.
Tachyons-palet utilityklassen
Wanneer je skeletonic-tachyons.min.css laadt, krijg je een volledige set
eendoels kleurklassen — hetzelfde geleverde artefact, opt-in-module.
<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>
De volledige Tachyons-paletspecificatie is gedocumenteerd op tachyons.io/docs/themes/skins; de hier geleverde versie is degene die Skeletonic compileert.