តើវាផ្តល់កូដពណ៌អ្វីខ្លះដល់ខ្ញុំ?

HEX, RGB, HSL, HSV, CMYK និង OKLCH សម្រាប់ពណ៌ដូចគ្នា ត្រៀមចម្លង។

តើខ្ញុំអាចជ្រើសរើសពណ៌ពីអេក្រង់របស់ខ្ញុំបានទេ?

បាន ជាមួយ Pick from screen ក្នុងកម្មវិធីរុករកផ្អែកលើ Chromium ដូចជា Chrome និង Edge។ ប៊ូតុងត្រូវបានលាក់នៅពេលកម្មវិធីរុករករបស់អ្នកមិនគាំទ្រវា។

តើវាពិនិត្យថាអត្ថបទអាចអានបានលើពណ៌នោះទេ?

បាន។ វាបង្ហាញអត្រាកម្រិតពណ៌ផ្ទុយ WCAG ធៀបនឹងពណ៌ស និងខ្មៅ ហើយសម្គាល់ថា AA large, AA, AAA ឬ Fails។ វាក៏ណែនាំពណ៌បំពេញ triadic, analogous និង monochromatic ដែរ។

តើវាឥតគិតថ្លៃពិតមែនទេ?

ពិតប្រាកដណាស់។ ឧបករណ៍ទាំងអស់គឺអាចប្រើបានដោយឥតគិតថ្លៃ ដោយមិនបាច់មានគណនី និងមិនបាច់ប្រើកាតឥណទានឡើយ។ ការងារទាំងអស់ដំណើរការនៅលើឧបករណ៍របស់អ្នកផ្ទាល់ ជាជាងនៅលើម៉ាស៊ីនបម្រើ (server) របស់យើង ដែលនេះហើយជាមូលហេតុធ្វើឱ្យវាដំណើរការដោយឥតគិតថ្លៃ។

វាដំណើរការនៅលើទូរស័ព្ទទេ?

បាទ/ចាស។ វាដំណើរការលើកម្មវិធីរុករកទូរសព្ទទំនើបលើ iOS និង Android ដោយមិនចាំបាច់ដំឡើងអ្វីទេ។

🎨

ការជ្រើសរើសពណ៌ និងកម្មវិធីបង្កើត Palette ឥតគិតថ្លៃ

ជ្រើសរើសពណ៌ បំប្លែងរវាង HEX/RGB/HSL និងបង្កើត palette ដែលផ្គូផ្គង។

ដំណើរការក្នុងកម្មវិធីរុករករបស់អ្នកគ្មានការចុះឈ្មោះ គ្មានបង្អួចលេចឡើងមិនចាំបាច់ចូលគណនីឥតគិតថ្លៃជារៀងរហូត

ធ្វើការក្រៅបណ្តាញនៅពេលបានផ្ទុករួច

ជ្រើសរើសពណ៌

HEX

HSV

h217°

s76%

v96%

បង្ហាញលើច

RGB

HSL

ទម្រង់ច្រើនទៀត

Alpha100%

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
ធាតុចូលពណ៌តាម API ដើមកំណើត
អ្នកជ្រើសរើសពណ៌តាម widget ភ្ជាប់ជាមួយ <input type="color"> របស់កម្មវិធីរុករក ឬ — ក្នុងកម្មវិធីរុករកមាន Chromium — EyeDropper API អនុញ្ញាតឱ្យអ្នកយកគំរូ pixel ណាមួយនៅលើអេក្រង់របស់អ្នក។ ផ្លូវទាំងពីរត្រឡប់ string hex ដែលក្លាយជាប្រភពសមតែមួយគត់នៃការពិត។
2
ការបម្លែងទម្រង់សរសេរដោយដៃ
ឧបករណ៍បម្លែងតម្លៃ hex ទៅ RGB, HSL, HSV, CMYK និង OKLCH ដោយប្រើអនុគមន៍គណិតវិទ្យារបស់ខ្លួនឯង (គ្មានបណ្ណាល័យខាងក្រៅ)។ ការបម្លែង OKLCH ធ្វើ linearizes ប៉ុស្តិ៍ sRGB អនុវត្ត matrix OKLab cube-root រួចទទួល chroma និងមុំ hue — ត្រូវនឹងលទ្ធផល CSS Color Level 4 ទំនើប។
3
ការគណនាសមាមាត្រភាពផ្ទុយគ្នា WCAG
Luminance ដែលទាក់ទងគ្នាត្រូវបានគណនាពីប៉ុស្តិ៍ RGB linearized ដោយប្រើរូបមន្ត WCAG 2.x។ ឧបករណ៍បន្ទាប់មកគណនាសមាមាត្រភាពផ្ទុយគ្នានឹងសបរិសុទ្ធ និងខ្មៅបរិសុទ្ធ ហើយដាក់ស្លាកពួកវា AA-large, AA, AAA ឬ Fail តាមកម្រិត WCAG (3:1, 4.5:1, 7:1)។
4
ការបង្កើតក្រុមពណ៌ភាពសម្រប និងការរក្សាទុកក្នុងស្រុក
swatch បំពេញគ្នា ត្រីកោណ ស្រដៀង និងពណ៌តែមួយត្រូវបានទទួលដោយបង្វិល ឬជំហានតម្លៃ hue និងភាពភ្លឺ HSL តាមគណិតវិទ្យា។ ក្រុមពណ៌ដែលបានរក្សាទុកត្រូវបានសរសេរទៅ localStorage នៅក្នុងកម្មវិធីរុករករបស់អ្នក — គ្មានអ្វីចាកចេញពីឧបករណ៍របស់អ្នកទេ។