Skeletonic Stylus v2.0.0 dostarcza trzy opcjonalne palety kolorow, kazda dystrybuowana jako oddzielny zminifikowany arkusz stylow, wiec placisz tylko za to, czego uzywasz.
| Paleta | Plik | Rozmiar (min) |
|---|---|---|
| Material | dist/css/palettes/material/skeletonic-material.min.css |
~8 KB |
| Tachyons | dist/css/palettes/tachyons/skeletonic-tachyons.min.css |
7,3 KB |
| Web-safe | dist/css/palettes/websafe/skeletonic-websafe.min.css |
~4 KB |
Ta strona laduje palete Tachyons, dzieki czemu klasy narzedzi kolorow ponizej renderuja sie poprawnie.
Podstawowe szarosci Skeletonic
Glowny arkusz stylow dostarcza dostepna 11-stopniowa skale szarosci udostepniona jako --cl-grey-100 … --cl-grey-1000.
Kolory marki (v2.0.0 — kontrast AA)
W v2.0.0 tokeny primary i secondary zostaly przyciemnione, aby spelniac wymaganie kontrastu WCAG 4,5:1 na bialym tekscie od razu po instalacji.
hsl(210 100% 42%)
hsl(195 100% 33%)
#757c8a
Uwaga.
--cl-tertiary(#757c8a) osiaga wspolczynnik kontrastu 4.71:1 wzgledem bieli — zgodny z AA dla duzego tekstu (≥ 18 px pogrubiony / ≥ 24 px zwykly), ale nie dla tekstu glownego. Lacz go z ciemniejszymi tlami lub uzywaj wylacznie do nieistotnych elementow dekoracyjnych.
Klasy narzedzi palety Tachyons
Po zaladowaniu skeletonic-tachyons.min.css otrzymujesz pelny zestaw jednofunkcyjnych klas kolorow — ten sam dostarczany artefakt, modul opt-in.
<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>
Pelna specyfikacja palety Tachyons jest udokumentowana na tachyons.io/docs/themes/skins; wersja dostarczana tutaj jest ta kompilowana przez Skeletonic.