Тёмный базовый шаблон — 125 готовых цветовых схем для antd
Знакомо? Дизайнер приносит макет, а вся ваша темизация Ant Design сводится к копанию в конфиге и ручному подбору оттенков. Есть решение попроще.
Встречайте Ant Design DarkTheme — репозиторий с 125 готовыми JSON-файлами тёмных тем. Каждая — отдельная цветовая схема в формате, который Ant Design 5.x принимает из коробки через theme.defaultConfig / ConfigProvider. Никаких зависимостей, никакого额外的 кода. Скачали JSON, подключили, получили готовую тёмную тему.
Что внутри
Каждый файл — это строка JSON с полным набором цветовых токенов: primary, background, текст, состояния, бордеры и производные оттенки. Формат совместим с antd 5.x из коробки:
import { ConfigProvider, theme } from 'antd';
import darkTheme from './themes/antd.dark.theme.react-admin.json';
<ConfigProvider
theme={{
algorithm: theme.darkAlgorithm,
token: darkTheme,
}}
>
<App />
</ConfigProvider>
Репозиторий не привязан к конкретному стеку — есть версии для React, Vue и Angular.
Зачем это нужно
Причины присмотреться:
- 125 вариантов — от Office и macOS-подобных до High Contrast и Material Design 3
- Структура токенов следует рекомендациям antd team (Seed Map → Map Algorithm → Alias Token)
- Файлы JSON весом ~1-2 КБ — никакой нагрузки на бандл
- MIT-лицензия — можно использовать в коммерческих проектах
Кому подойдёт
Тем, кто строит админ-панели и дашборды на Ant Design и хочет быстро добавить поддержку тёмной темы. Особенно если под рукой дизайнера нет, а писать токены с нуля не хочется.
Загляните в репозиторий ant-design-dark-theme, возможно, нужная схема уже готова.
