Aller au contenu principal

    Мы используем cookies

    Мы используем cookies для улучшения вашего опыта. Продолжая просмотр, вы соглашаетесь на их использование.

    Подробнее в нашей Cookies и Конфиденциальность

    Тема shadcn/ui

    Генерируйте темы для shadcn/ui. Используйте Тема shadcn/ui бесплатно онлайн без регистрации, с быстрым результатом и безопасной обработкой в браузере.

    Base

    Primary

    Secondary

    Muted & Accent

    Destructive

    Borders & Input

    Предпросмотр

    Предпросмотр компонентов

    Card content

    Muted text example

    @layer base {
  :root {
    --background: 0 0% 100%;
    --foreground: 0 0% 4%;
    --card: 0 0% 100%;
    --card-foreground: 0 0% 4%;
    --popover: 0 0% 100%;
    --popover-foreground: 0 0% 4%;
    --primary: 0 0% 9%;
    --primary-foreground: 0 0% 98%;
    --secondary: 0 0% 96%;
    --secondary-foreground: 0 0% 9%;
    --muted: 0 0% 96%;
    --muted-foreground: 0 0% 45%;
    --accent: 0 0% 96%;
    --accent-foreground: 0 0% 9%;
    --destructive: 0 84% 60%;
    --destructive-foreground: 0 0% 98%;
    --border: 0 0% 90%;
    --input: 0 0% 90%;
    --ring: 0 0% 9%;
    --radius: 0.5rem;
  }
}

    Тема shadcn/ui помогает работать с цветами прямо в браузере.

    Инструмент создан для дизайнеров, разработчиков и креаторов, которым нужны быстрые и надежные результаты.

    Supported formats

    CSS
    Tailwind
    HSL
    shadcn/ui

    How it works

    1

    Step 1

    Откройте Тема shadcn/ui

    2

    Step 2

    Введите или импортируйте цвета

    3

    Step 3

    Скопируйте, экспортируйте или используйте результат повторно

    Распространённые ошибки

    • Если не проверить контраст, читаемость может ухудшиться.
    • Слишком много цветов усложняет использование палитры.

    Советы профессионалов

    • Храните основные цвета как CSS-переменные.
    • Проверьте палитру в светлой и темной теме перед публикацией.

    Privacy guaranteed: everything is processed locally in your browser.

    По возможности обработка выполняется локально в браузере. Аккаунт не требуется.

    Тема shadcn/ui для ваших цветовых проектов

    Генерируйте темы для shadcn/ui.

    Тема shadcn/ui без потери точности

    Преобразования используют точные значения (HEX, RGB, HSL, OKLCH). Никакого визуального приближения — вы получаете цвет, верный вашему дизайну.

    Тема shadcn/ui бесплатно онлайн

    Без регистрации и установки. Тема shadcn/ui полностью бесплатен и работает в любом браузере. Бесплатный план включает 10 использований в день.

    Тема shadcn/ui быстро и безопасно

    Обработка происходит прямо в браузере для максимальной скорости. Данные не отправляются на наши серверы — ваши цвета остаются приватными.

    Тема shadcn/ui для обмена и совместной работы

    Экспортируйте результаты в HEX, RGB, HSL, CSS, JSON или копируйте одним кликом. Идеально для обмена цветовой палитрой с командой или документации design system.

    Все наши инструменты для цвета

    Извлекайте, конвертируйте, создавайте палитры, градиенты и контрасты WCAG в пару кликов.

    Все инструменты

    Related tools

    Tailwind палитра
    CSS переменные
    UI предпросмотр
    Контраст цветов

    Руководства и уроки

    Узнайте, как использовать наши инструменты с подробными руководствами.

    shadcn-theme: практическое руководство по developer

    Локализованное руководство по shadcn-theme: лучшие практики developer и частые ошибки.

    shadcn-theme: практическое руководство по developer

    Локализованное руководство по shadcn-theme: лучшие практики developer и частые ошибки.

    shadcn-theme: практическое руководство по developer

    Локализованное руководство по shadcn-theme: лучшие практики developer и частые ошибки.

    Frequently asked questions

    Да, инструмент доступен онлайн бесплатно.

    По возможности обработка выполняется в браузере для защиты данных.