O Skeletonic Stylus v2.0.0 inclui tres paletas de cores opcionais, cada uma distribuida como sua propria folha de estilos minificada para que voce pague apenas pelo que usar.
| Paleta | Arquivo | Tamanho (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 |
| Web-safe | dist/css/palettes/websafe/skeletonic-websafe.min.css |
≈3.5 KB |
Esta pagina carrega a paleta Tachyons para que as classes utilitarias de cores abaixo sejam renderizadas corretamente.
Escala de cinzas do Skeletonic
A folha de estilos principal inclui uma escala de cinzas acessivel com
11 niveis, exposta como --cl-grey-100 … --cl-grey-1000.
Cores da marca (v2.0.0 — contraste AA)
Na v2.0.0, os tokens primario e secundario foram escurecidos para atender ao contraste WCAG 4.5:1 contra texto branco por padrao.
hsl(210 100% 42%)
hsl(195 100% 33%)
#757c8a
Nota.
--cl-tertiary(#757c8a) atinge uma relacao de contraste de 4.71:1 contra branco — em conformidade com AA para texto grande (≥ 18 px negrito / ≥ 24 px regular), mas nao para texto corrido. Combine com fundos mais escuros ou use apenas para elementos decorativos nao essenciais.
Classes utilitarias da paleta Tachyons
Ao carregar skeletonic-tachyons.min.css, voce obtem um conjunto
completo de classes de cores de proposito unico — mesmo artefato
distribuido, modulo 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>
A especificacao completa da paleta Tachyons esta documentada em tachyons.io/docs/themes/skins; a versao incluida aqui e a compilada pelo Skeletonic.