Конвертер боја

Конвертујте између hex, RGB, HSL, OKLCH и OKLAB формата уз проверу контраста и извоз CSS токена.

Тренутна боја

#953769

Предложена боја предњег плана

#FFFFFF

Комплементарна боја

#007653

Hex

RGB(A)

HSL(A)

OKLCH

OKLAB

Алфа

Tailwind тема

Генеришите комплетну бренд палету за Tailwind CSS 4 или 3 из тренутне боје.

@theme {
  --color-brand-50: oklch(94.5% 0.0212 350.46);
  --color-brand-100: oklch(89.49% 0.0339 350.46);
  --color-brand-200: oklch(81.48% 0.0542 350.46);
  --color-brand-300: oklch(72.47% 0.0771 350.46);
  --color-brand-400: oklch(61.46% 0.105 350.46);
  --color-brand-500: oklch(48.44% 0.138 350.46);
  --color-brand-600: oklch(43.57% 0.1236 350.46);
  --color-brand-700: oklch(38.7% 0.1093 350.46);
  --color-brand-800: oklch(33.22% 0.0932 350.46);
  --color-brand-900: oklch(27.74% 0.077 350.46);
  --color-brand-950: oklch(23.48% 0.0644 350.46);
}

oklch(94.5% 0.0212 350.46)

100

oklch(89.49% 0.0339 350.46)

200

oklch(81.48% 0.0542 350.46)

300

oklch(72.47% 0.0771 350.46)

400

oklch(61.46% 0.105 350.46)

500

oklch(48.44% 0.138 350.46)

600

oklch(43.57% 0.1236 350.46)

700

oklch(38.7% 0.1093 350.46)

800

oklch(33.22% 0.0932 350.46)

900

oklch(27.74% 0.077 350.46)

950

oklch(23.48% 0.0644 350.46)

CSS варијабле

:root {
  --brand: oklch(48.44% 0.138 350.46);
  --brand-rgb: rgb(149, 55, 105);
  --brand-foreground: #ffffff;
}

О CSS конверзији боја

Конвертери боја помажу да исту боју пребаците између HEX, RGB, HSL, OKLCH и OKLAB формата. Најкориснији су када вам требају читљив излаз, контекст контраста и вредности спремне за CSS или Tailwind.

HEX, RGB, HSL и CSS боје

HEX, RGB и HSL покривају већину свакодневних токова рада у прегледачу, дизајну и frontend-у.

Брза конверзија вам омогућава да налепите једну вредност и користите је свуда без ручног преписивања синтаксе.

Зашто су OKLCH и OKLAB важни

OKLCH и OKLAB су бољи за прављење глатких скала и предвидивих промена светлине.

Олакшавају рад на палетама када вам требају уравнотежени прелази и поуздан контраст.

Провера контраста и Tailwind излаз

Провера контраста и излаз спреман за framework претварају конвертер у практичан УИ алат.

Брже прелазите од једне улазне боје до приступачних избора текста и Tailwind-friendly токена.

Честа питања

Одговори о подржаним форматима боја, када користити перцептивне просторе попут OKLCH и како тумачити излазе за контраст и Tailwind.

Остале алатке

Прегледајте сваку посебну страницу алатке са почетног центра или из центрираног бирача у заглављу.

Слике

WebP конвертер

Конвертујте до 10 JPEG, PNG или WebP слика у WebP уз пресете квалитета и ZIP преузимања.

Отвори WebP конвертер

Ресурси

Генератор favicon-а / икона апликације

Отпремите једну квадратну изворну слику и генеришите favicon пакет са иконама апликације и почетним веб манифестом.

Отвори Генератор favicon-а

Формати података

JSON / YAML / TOML конвертер

Валидирајте, улепшајте, минимизирајте и конвертујте JSON, YAML и TOML уз јасна упозорења о компатибилности.

Отвори JSON / YAML / TOML

Формати података

CSV валидатор

Валидирајте CSV датотеке и налепљене редове уз препознавање делимитера, проверу заглавља, листе проблема и парсиране прегледе.

Отвори CSV валидатор

Текст

Case / Slug / Escape

Конвертујте текст у camelCase, snake_case, kebab-case, PascalCase, slug-ове и уобичајене escape облике.

Отвори Case / Slug / Escape

Текст

Markdown валидатор и преглед

Валидирајте структуру Markdown-а, прегледајте рендеровани излаз и ухватите уобичајене проблеме у писању пре објаве.

Отвори Markdown валидатор

HEX, RGB, HSL и CSS боје

Зашто су OKLCH и OKLAB важни

Провера контраста и Tailwind излаз

Које формате боја могу налепим у конвертер боја?

Када треба користити OKLCH или OKLAB уместо HEX-а или HSL-а?

Шта значи предложена боја предњег плана?