Молниеносная скорость
Проектируйте и настраивайте адаптивные интерфейсы за минуты. Нативные CSS-переменные, готовые классы, 12-колоночная сетка для любого семантического HTML-элемента.
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
Коротко о главном
Skeletonic Stylus — это CSS-библиотека с открытым исходным кодом на Stylus, для доступной, быстрой и модульной стилизации интерфейсов.
Проект появился в 2018 году как личный эксперимент по уменьшению объёма CSS без потери удобства полноценной компонентной библиотеки. Восемь лет спустя цель не изменилась.
Что вы получаете
Легковесность
8,3 КБ в gzip. Страницы загружаются быстрее. Все основные строительные блоки на месте.
Адаптивный дизайн
Разработано для настольных и мобильных устройств. Макеты подстраиваются под любое устройство. Оптимизировано для сенсорных экранов, семантический HTML повсюду.
Доступность
WCAG 2.2 встроен: кольца focus-visible, контраст AA, skip-link хелперы, компоненты, удобные для клавиатуры, поддержка уменьшенного движения — без дополнительных стилей, без шаблонного aria-*.
Библиотека компонентов
Модульные CSS-компоненты и Stylus-миксины. Кнопки, формы, карточки, уведомления, бейджи, палитры и анимации — чисто, модульно, готово к использованию.
Бесплатно и с открытым кодом
Спроектировано, разработано и поддерживается Себастьеном Руссо. Двойная лицензия: MIT или Apache 2.0. Без сборов, без лицензионных платежей, в том числе для коммерческого использования.
Сравнение с альтернативами
Один самостоятельно размещаемый файл стилей покрывает типографику, кнопки, формы, карточки, таблицы, палитры, анимации и утилитарные классы. Без JavaScript. Без обязательного этапа сборки. Без зависимостей от Bootstrap, Tailwind или Bulma.
| Характеристика | Skeletonic Stylus | Bootstrap 5 | Tailwind CSS | Bulma |
|---|---|---|---|---|
| Размер в gzip | 8,3 КБ | ~30 КБ | ~10 КБ JIT | ~30 КБ |
| Соответствие WCAG 2.2 | Встроено | Частично | Вручную | Частично |
| Каскадные слои | Да (@layer) |
Нет | Нет | Нет |
| Тёмная тема | prefers-color-scheme |
Опционально | На основе классов | Опционально |
| Требуется JavaScript | Нет | Да (Popper) | Нет | Нет |
| CycloneDX SBOM | Да | Нет | Нет | Нет |
| Уменьшенное движение | Учитывается | Частично | Вручную | Частично |
| Лицензия | MIT или Apache 2.0 | MIT | MIT | MIT |
Принципы
- Доступность — это основа, а не надстройка. Соответствие WCAG 2.2 встроено в каждый компонент, а не добавлено как отдельная «тема».
- Каждый байт на счету. Один файл стилей не должен раздувать бюджет страницы. Лимит в 8 КБ gzip контролируется в CI.
- Каскадные слои побеждают войны специфичности. Переопределяйте что угодно с уверенностью — без
!important, без трюков с порядком DOM. - Stylus по-прежнему хорош. Лаконичный, выразительный, позволяет уместить библиотеку в ~3 000 читаемых строк.
- Скучное — это преимущество. Без JS-зависимостей. Без магии на этапе сборки. Без ломающих переименований. CSS-классы делают именно то, что говорит их название.
- Настройка за секунды. Нативные CSS Custom Properties для цветов, отступов, типографики и радиусов.
- Защищённая цепочка поставок. Подписанный npm-провенанс. Закреплённые обновления Dependabot. CVE-2023-44270 исправлена через overrides.
Версионирование и semver
Skeletonic Stylus следует Semantic Versioning 2.0.
| Уровень | Когда | Пример |
|---|---|---|
| Major | Удаление или переименование публичного класса, миксина или токена | 1.x → 2.0 |
| Minor | Добавление нового компонента, миксина или токена | 1.1 → 1.2 |
| Patch | Исправление ошибок, доработка a11y, производительность, безопасность | 1.1.6 → 2.0.0 |
Все публичные имена классов, все CSS Custom Properties и все экспортируемые Stylus-миксины являются частью публичного API. Ломающее изменение получает major-версию и руководство по миграции.
Сопровождение
Skeletonic Stylus спроектирован, разработан и поддерживается Себастьеном Руссо. Двойная лицензия: MIT и Apache 2.0.
Вопросы, идеи и вклад приветствуются — руководство по участию.