Ultrarapido
Projete e personalize interfaces responsivas em minutos. Variaveis CSS nativas, classes predefinidas e um grid de 12 colunas cobrindo cada elemento HTML semantico.
Translation note (2026-04-30). v2.0.0 adds RTL support and a refreshed 2026 framework comparison. The English source is the canonical reference while these translations catch up. See https://skeletonic.io/about/ · https://skeletonic.io/components/ · https://skeletonic.io/benchmarks/.
- Version
- 2.0.0
- Gzip
- 7.7 KB
- Brotli
- 6.7 KB
- License
- MIT or Apache-2.0
- Standard
- WCAG 2.2 AA
A versao resumida
Skeletonic Stylus e uma biblioteca CSS Stylus de codigo aberto para estilizacao de interfaces acessiveis, rapidas e modulares.
Nasceu em 2018 como um experimento pessoal em entregar menos CSS sem abrir mao da ergonomia de uma biblioteca de componentes real. Oito anos depois, o objetivo continua o mesmo.
O que voce recebe
Leve
8,3 KB gzipped. As paginas carregam mais rapido. Todos os blocos essenciais permanecem incluidos.
Design responsivo
Criado para desktop e dispositivos moveis. Os layouts se adaptam a qualquer aparelho. Otimizado para toque, com HTML semantico em toda a estrutura.
Acessibilidade
WCAG 2.2 integrado: aneis focus-visible, contraste AA, helpers de skip-link, componentes amigaveis ao teclado, suporte a movimento reduzido — sem stylesheet extra, sem boilerplate aria-*.
Biblioteca de componentes
Componentes CSS modulares e mixins Stylus. Botoes, formularios, cards, alertas, badges, paletas e animacoes — limpos, modulares, prontos para usar.
Gratuito & codigo aberto
Projetado, desenvolvido e mantido por Sebastien Rousseau. Licenciado sob MIT ou Apache 2.0. Sem taxas, sem custos de licenciamento, mesmo para uso comercial.
Como se compara
Uma unica folha de estilos auto-hospedada cobre tipografia, botoes, formularios, cards, tabelas, paletas, animacoes e classes utilitarias. Sem JavaScript. Sem etapa de build obrigatoria. Sem dependencias de Bootstrap, Tailwind ou Bulma.
| Recurso | Skeletonic Stylus | Bootstrap 5 | Tailwind CSS | Bulma |
|---|---|---|---|---|
| Tamanho gzipped | 8,3 KB | ~30 KB | ~10 KB (varies) | ~30 KB |
| Conformidade WCAG 2.2 | Integrada | Parcial | Manual | Parcial |
| Cascade layers | Sim (@layer) |
Nao | Nao | Nao |
| Modo escuro | prefers-color-scheme |
Opt-in | Baseado em classes | Opt-in |
| JavaScript necessario | Nao | Sim (Popper) | Nao | Nao |
| CycloneDX SBOM | Sim | Nao | Nao | Nao |
| Movimento reduzido | Respeitado | Parcial | Manual | Parcial |
| Licenca | MIT ou Apache 2.0 | MIT | MIT | MIT |
Principios
- Acessibilidade e o piso, nao o teto. A conformidade com WCAG 2.2 esta integrada em cada componente, nunca adicionada como um "tema".
- Cada byte importa. Uma unica folha de estilos entregue nao deve estourar seu orcamento de peso de pagina. O limite de 8 KB gzipped e aplicado no CI.
- Cascade layers vencem guerras de especificidade. Sobrescreva qualquer coisa com confianca — sem
!important, sem truques de ordem no DOM. - Stylus continua sendo uma otima opcao. Conciso, expressivo e permite manter a biblioteca em ~3.000 linhas legiveis.
- Chato e um recurso. Sem dependencias JS. Sem magica em tempo de build. Sem renomeacoes que quebram compatibilidade. Classes CSS que fazem exatamente o que dizem.
- Personalizavel em segundos. CSS custom properties nativas para cores, espacamento, tipografia e bordas arredondadas.
- Cadeia de suprimentos fortalecida. Procedencia npm assinada. Atualizacoes Dependabot fixadas. CVE-2023-44270 corrigido via overrides.
Versionamento & semver
Skeletonic Stylus segue o Semantic Versioning 2.0.
| Nivel | Quando | Exemplo |
|---|---|---|
| Major | Remocao ou renomeacao de uma classe publica, mixin ou token | 1.x → 2.0 |
| Minor | Adicao de um novo componente, mixin ou token | 1.1 → 1.2 |
| Patch | Correcoes de bugs, ajustes de a11y, performance, seguranca | 1.1.6 → 2.0.0 |
Todos os nomes de classes publicas, todas as CSS custom properties e todos os mixins Stylus exportados fazem parte da API publica. Uma mudanca que quebra compatibilidade recebe um bump major e um guia de migracao.
Responsabilidade
Skeletonic Stylus e projetado, desenvolvido e mantido por Sebastien Rousseau. Licenciado sob MIT e Apache 2.0.
Issues, ideias e contribuicoes sao bem-vindas — veja o guia de contribuicao.