Кескін түс палитрасын алу — тегін
k-means түс кванттаумен кез келген кескіннен үстем түстерді алып шығыңыз. Фотосуретіңіздегі немесе логотипіңіздегі ең жоғарғы 2-16 түр үшін он алтылық кодтарды алыңыз.
Файлды осы жерге тастаңыз немесе таңдау үшін басыңыз
JPG, PNG, WebP, GIF, HEIC, HEIF · құрылғыңызда өңделеді
немесе алмасу буферінен қою үшін Ctrl+V басыңыз
Кеңес: скриншотты Ctrl+V арқылы қоюға болады
Файлдарыңыз ешқашан құрылғыңызды тастамайды. Барлық өңдеу шолғышыңызда жергілікті түрде жүзеге асырылады.
Жиі қолданылуы
- Логотиптен бренд түстерін шығарыңызКез келген логотиптің немесе бренд суретінің өндіктіліктелігінің түстерінің дәл hex кодын алыңыз.
- Суреттерінен веб түс палитрасын құрыңызБатыс суреттеріңіз немесе фон суреттеріңіздің ең бәрінің түс палитрасын құрыңыз.
- Туыны суреттеріңіздің түстерін шығарыңызІшкі дизайн немесе мода суреттеріңіздің түс палитрасын шығарыңыз және өндіктеріңіздің құрыңыз.
- Сурет және өнері палитрасын талдаңызӘйтеген суреттерінің немесе өндіктеріңіздің түс палитрасын өндіктіліктелігінің түстерін шығарға талдаңыз.
- Суреттерінен CSS теңдіктерін құрыңызСуреттеріңіздің CSS айнымалы теңдіктерін құрыңыз - динамиялық теңдіктер немесе автоматты түс сұрып болып өстеу үшін пайдалы.
Қалай жұмыс істейді
Түс алу Canvas API-дан оқылған шикі пиксель деректеріне қолданылған қолмен жазылған k-means++ кластерлеу алгоритмі арқылы толығымен браузеріңізде жұмыс істейді — сервер жоқ, үшінші тарап кітапханасы жоқ. Алгоритм Math.random-ның орнына детерминистикалық псевдокездейсоқ сан генераторын (mulberry32) пайдаланатындықтан, бірдей кескін мен түс-саны баптаулары әрқашан бірдей палитраны шығарады.
- 1Canvas пиксель деректерін оқидыКескін экраннан тыс HTML Canvas элементіне салынады және ең ұзын жағында ең көбі 200px-ке дейін төмендетіледі. Canvas API-дың getImageData() әрбір пиксельді шикі RGBA байттар ретінде қайтарады, толығымен мөлдір пикселдер (альфа < 128) кластерлеу басталмас бұрын алынып тасталады.
- 2k-means++ пикселдерді кластерлейдіk-means++ бастаушысы центроидтарды детерминистикалық түрде себеді, содан кейін алгоритм 20 ретке дейін қайталанады: әр пиксель RGB кеңістігінде ең жақын центроидқа тағайындалады, содан кейін центроидтар барлық тағайындалған пикселдердің ортасы ретінде қайта есептеледі. Бірдей он алтылық мәнге дейін құлайтын кластерлер біріктіріледі, сондықтан нәтижедегі әр үлгі бірегей.
- 3Түс бойынша метадеректер есептеледіӘр центроид HEX, HSL-ге және жалпы пикселдердегі үлесіне (пайыз) түрлендіріледі. WCAG салыстырмалы жарықтылығы стандартты формула бойынша есептеледі, ал қара мен ақ түстерге қарсы контраст қатынастары әр үлгіде көрсетіледі.
- 4Экспорт және тамшы алғыш шығысыПалитраны CSS таңдаулы қасиеттер, SCSS айнымалылары, Tailwind баптау үзіндісі немесе JSON ретінде көшіруге болады. Түртіп-үлгі алу тамшы алғышы алдын ала қараудағы түртуіңізді толық ажыратымдылықтағы canvas-тағы нақты бастапқы пиксель координаттарына сәйкестендіреді, сол пиксель түсін бөлек таңдалған-түстер тізіміне қосады. PNG палитра жолағын Canvas toBlob() арқылы жүктеп алуға болады.
Кескініңіз ешқашан жүктелмейді — ол толығымен браузеріңіздің жадында декодталады және өңделеді, тек файл өлшемі (КБ-мен) аналитикаға хабарланады.
Байланысты құралдар
Кездейсоқ түс генераторы
Кездейсоқ түстерді бір-бірден немесе бестік палитра ретінде жасаңыз, ұнағандарын құлыптаңыз, HEX, RGB немесе HSL мәндерін көшіріңіз және палитраны PNG немесе CSS ретінде экспорттаңыз.
Түс палитрасы генераторы
Кез келген негіз түстен толықтырушы, аналогиялық, триадалық және монохромды түс палиталарын жасаңыз. Он алтылық кодтарды бір рет басу арқылы көшіріңіз.
Түс Таңдағыш және Палитра Генераторы
Түстерді таңдау, HEX/RGB/HSL арасында түрлендіру және үйлесімді палиттер жасау.