Генератар каляровай палітры — бясплатна
Генеруйце дадатковыя, аналагічныя, трыядныя і манахраматычныя каляровыя палітры з любога базавага колеру. Капіруйце hex-коды адным кліком.
Увядзіце hex-код, назву колеру, напрыклад teal або tomato, або rgb(20, 184, 166) / hsl(174, 80%, 40%), потым націсніце Enter.
Праверка тэксту і фону
Тыповыя выкарыстанні
- Генератар палітр колераў для веб-дызайнуСтварэнне гарманічных кветкавых схем для вебсайтаў, веб-прыменя і UI кампанентаў.
- Стварэнне брэндавых палітр колераўРазвіцё палнай брэндавай сістэмы колераў ад адного брэндавага колера — першаснае, другаснае, акцэнтнае і нейтральнае.
- Генератар палітр колераў для мастацтва і ілюстрацыіСтварэнне гарманічных кветкавых камбінацый для лічнага мастацтва, ілюстрацыі і творчых праектаў.
- Генератар кветкавых стыляў для FigmaСтварэнне палітр колераў для выкарыстання як Figma Color Styles і фундамэнта маркі дызайну.
- Стварэнне палітр колераў тёмнага рэжымуГенерацыя светлых і тёмных варыянтаў вашай палітры колераў для пабудовы дарк модаў.
Як гэта працуе
Інструмент пабудаваны без знешніх бібліятэк — уся каляровая матэматыка працуе ва ўласнаручна напісаным JavaScript непасрэдна ў вашым браўзеры. Ён канвертуе ваш абраны колер паміж шаснаццатковым фарматам і HSL, потым прымяняе класічныя правілы гармоніі каляровай тэорыі (камплементарная, трыядная, аналагічная і г.д.) праз арыфметыку на коле адцення, каб стварыць кожную палітру.
- 1Канвертаванне шаснаццатковага фармату ў HSLКалі вы абіраеце колер, інструмент разбірае шаснаццатковы радок на кампаненты RGB і пераводзіць іх у HSL (адценне, насычанасць, яркасць). Адценне — гэта пазіцыя ад 0 да 360 градусаў на коле колераў; уся матэматыка палітры адбываецца ў гэтай прасторы.
- 2Арыфметыка адцення для гармонііКожны тып палітры — гэта фіксаваная формула павароту, прыменаная да базавага адцення. Камплементарная дадае 180°, тыядная дадае 120° і 240°, тэтрадная крочыць на 90°, размеркавана-камплементарная выкарыстоўвае 150° і 210°. Монахраматычная і адценні захоўваюць адценне і насычанасць пастаяннымі, крочачы яркасцю ўверх і ўніз.
- 3Вывад HSL у шаснаццатковы фарматКожны вылічаны трыплет HSL пераводзіцца назад у шаснаццатковы колер з дапамогай стандартнай формулы хрома. Вынікі адлюстроўваюцца як каляровая паласа з аўтаматычна кантраставанымі пазнакамі (цёмны тэкст на светлых узорах, светлы тэкст на цёмных), вызначанымі простым парогам яркасці.
- 4Экспарт у ваш пажаданы фарматПалітру можна скапіяваць як шаснаццатковыя радкі ці экспартаваць як файл зменных CSS (:root { --color-1: … }), зменных SCSS, урывак канфігурацыі Tailwind, аб'ект JSON ці паласу колераў PNG. Экспарт PNG выкарыстоўвае Canvas API браўзера (toDataURL), каб намаляваць кожны ўзор з яго шаснаццатковай пазнакай — усё генеруецца лакальна пры націску.
Звязаныя інструменты
Генератар выпадковых колераў
Ствараеце выпадковыя колеры па адным або ў выглядзе палітры з пяці, блакуйце патрэбныя, капіруйце значэнні HEX, RGB або HSL і экспартуйце палітру як PNG або CSS.
Вытворца каляровай палітры выявы
Здабывайце дамінантныя колеры з любой выявы з дапамогай k-сярэдніх квантавання колераў. Атрымлівайце hex-коды для 2–16 асноўных колераў вашага фотаздымка або лагатыпа.
Выбар колеру і генератар палітры
Выбірайце колеры, канвертуйце паміж HEX/RGB/HSL і стварайце гарманічныя палітры.