Към основното съдържание
LibraTool logoLibraTool

Избор на цвят и генератор на палитра — безплатно

Избирайте цветове, конвертирайте между HEX/RGB/HSL и генерирайте хармонични палитри.

Работи офлайн след зареждане
HEX
HSV
h217°
s76%
v96%
само за дисплей

RGB

r
g
b

HSL

H
S
L

Повече формати

HEX8#3b82f6ff
RGBrgb(59 130 246)
HWBhwb(217 23% 4%)
CMYKcmyk(76%, 47%, 0%, 4%)
OKLCHoklch(62.3% 0.188 259.8)
SwiftUIColor(red: 0.231, green: 0.510, blue: 0.965, alpha: 1)
Android0xFF3B82F6
FlutterColor(0xFF3B82F6)

WCAG контраст

Най-близък наименован цвят: dodgerblue · Черен текст се чете по-лесно тук (5,71:1)

Текст на бяло3,68:1AA голямо
Текст на черно5,71:1AA
Текст върху #ffffff3,68:1AA голямо

Нюанси и оттенъци (50–950)

Цветова палитра

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

#3b82f6
#f6af3c

Триадичен

#3b82f6
#f63c83
#83f63c

Аналогично

#3ce0f6
#3b82f6
#523cf6

Едноцветен

#073c92
#0a5adb
#3b82f6
#85b2f9
#cee0fd

Често срещани употреби

  • Избор на цвят за уеб дизайнИзберете и генерирайте цветове за вашия уебсайт — получете HEX, RGB и HSL стойности плюс хармонични палети.
  • Избор на цвят за брендингСъздайте палета от цветове на вашия бранд — изберете първичен, вторичен и акцентен цвят, които работят заедно.
  • Избор на цвят за социални медииСъздайте привлекателни цветни палети за публикации в социалните медии, истории и дизайни на профили.
  • Избор на цвят за печат дизайнИзберете цветове за печатни материали — листовки, визитни картички, брошури — с точен цветен преглед.
  • Избор на цвят за презентацииПроектирайте цветни схеми за слайдове — изберете четливи цветове на текст, палети на диаграми и последователни акцентни тонове.

Как работи

Всичко работи директно във вашия браузър чрез ръчно написана математика за преобразуване — без цветова библиотека, без обръщение към сървъра. Избирате цвят чрез нативния вход за цвят на браузъра или EyeDropper API, а инструментът мигновено го преобразува в шест формата, като едновременно изчислява коефициенти на контраст по WCAG и генерира хармонични палитри.

  1. 1
    Вход на цвят чрез нативен API
    Избирате цвят чрез вградения в браузъра елемент <input type="color"> или — в браузъри, базирани на Chromium — EyeDropper API ви позволява да вземете проба от произволен пиксел на екрана си. И двата пътя връщат шестнадесетичен низ, който се превръща в единствения източник на истина.
  2. 2
    Ръчно написани преобразувания на формати
    Инструментът преобразува шестнадесетичната стойност в RGB, HSL, HSV, CMYK и OKLCH чрез собствени математически функции (без външна библиотека). Преобразуването в OKLCH линеаризира sRGB каналите, прилага кубично-коренната матрица на OKLab, след което извежда цветност и ъгъл на тона — съответствайки на съвременния изход на CSS Color Level 4.
  3. 3
    Изчисление на коефициента на контраст по WCAG
    Относителната яркост се изчислява от линеаризираните RGB канали по формулата на WCAG 2.x. Инструментът след това изчислява коефициенти на контраст спрямо чисто бяло и чисто черно и ги обозначава като AA-едър, AA, AAA или неуспешен, съгласно праговете на WCAG (3:1, 4.5:1, 7:1).
  4. 4
    Генериране на хармонична палитра и локално запазване
    Допълващи, триадни, аналогови и монохромни плочки се извеждат чрез математическо завъртане или стъпване на тона и светлината на HSL. Запазените палитри се записват в localStorage във вашия браузър — нищо не напуска устройството ви.

Свързани инструменти

Често задавани въпроси