កម្មវិធីបង្កើតនិង Selector de color

បង្កើតកូដពណ៌, បម្រែបម្រួល, ភាពស្របគ្នា, និងពិនិត្យអត្រាផ្ទុយ។

ការបំលែងពណ៌

HEX

#014b43

Aqua Deep

HEX
#014b43
HSL
174, 97, 15
RGB
1, 75, 67
XYZ
4, 5, 6
CMYK
99, 0, 11, 71
LUV
28,-19,4
LAB
28, -22, -1
HWB
174, 0, 71

បំរែបំរួល

គោលបំណងនៃផ្នែកនេះគឺដើម្បីផលិតពណ៌ស្រអាប់ (បន្ថែមពណ៌សសុទ្ធ) និងពណ៌ងងឹត (បន្ថែមពណ៌ខ្មៅសុទ្ធ) នៃពណ៌ដែលអ្នកបានជ្រើសរើសក្នុងកម្រិត 10%។

គន្លឹះជំនាញ៖ ប្រើពណ៌ងងឹតសម្រាប់ស្ថានភាពលើកឡើង និងស្រមោល ពណ៌ស្រអាប់សម្រាប់ពន្លឺ និងផ្ទៃខាងក្រោយ។

ពណ៌ងងឹត

បំរែបំរួលងងឹតបង្កើតឡើងដោយបន្ថែមពណ៌ខ្មៅទៅពណ៌មូលដ្ឋានរបស់អ្នក។

ពណ៌ស្រអាប់

បំរែបំរួលស្រអាប់បង្កើតឡើងដោយបន្ថែមពណ៌សទៅពណ៌មូលដ្ឋានរបស់អ្នក។

ករណីប្រើប្រាស់ទូទៅ

  • ស្ថានភាពផ្នែក UI (លើកឡើង សកម្ម មិនសកម្ម)
  • បង្កើតជម្រៅជាមួយស្រមោល និងពន្លឺ
  • បង្កើតប្រព័ន្ធពណ៌ដែលមានភាពជាប់លាប់

គន្លឹះប្រព័ន្ធរចនា

បំរែបំរួលទាំងនេះបង្កើតមូលដ្ឋាននៃផ្ទាំងពណ៌ដែលមានភាពជាប់លាប់។ នាំចេញពួកវាដើម្បីរក្សាការស្របគ្នាទូទាំងគម្រោងរបស់អ្នក។

ការរួមបញ្ចូលពណ៌

ភាពស្របគ្នានីមួយៗមានអារម្មណ៍ផ្ទាល់ខ្លួន។ ប្រើភាពស្របគ្នាដើម្បីគិតពណ៌ដែលដំណើរការល្អជាមួយគ្នា។

របៀបប្រើប្រាស់

ចុចលើពណ៌ណាមួយដើម្បីចម្លងតម្លៃ hex របស់វា។ ការរួមបញ្ចូលទាំងនេះត្រូវបានគណនាម៉ាត្រិកដើម្បីបង្កើតភាពស្របគ្នាផ្នែកមើលឃើញ។

ហេតុអ្វីវាសំខាន់

ភាពស្របគ្នានៃពណ៌បង្កើតសមាមាត្រនិងបង្កើនអារម្មណ៍ជាក់លាក់នៅក្នុងការរចនារបស់អ្នក។

បំពេញ

ពណ៌មួយ និងពណ៌ផ្ទុយរបស់វានៅលើកង់ពណ៌, +180 ដឺក្រេនៃពណ៌។ មានការប្រៀបធៀបខ្ពស់។

#014b43
ល្អបំផុតសម្រាប់: ការរចនាដែលមានឥទ្ធិពលខ្លាំង, CTA, រូបសញ្ញា

បំពេញបែបបំបែក

ពណ៌មួយ និងពីរដែលនៅជាប់នឹងពណ៌បំពេញរបស់វា, +/-30 ដឺក្រេនៃពណ៌ពីតម្លៃផ្ទុយនឹងពណ៌សំខាន់។ ដ៏ក្លាហានដូចជាការបំពេញត្រង់, ប៉ុន្តែមានភាពចម្រុះជាង។

ល្អបំផុតសម្រាប់: ប្លង់ដែលមានពណ៌ស្រស់ប៉ុន្តែមានតុល្យភាព

ត្រីកោណ

ពណ៌បីដែលមានចន្លោះស្មើគ្នានៅលើកង់ពណ៌, 120 ដឺក្រេនៃពណ៌ពីគ្នា។ ល្អបំផុតសម្រាប់អនុញ្ញាតឱ្យពណ៌មួយមានឥទ្ធិពល និងប្រើពណ៌ផ្សេងទៀតជាពណ៌បន្ថែម។

ល្អបំផុតសម្រាប់: ការរចនាដែលមានភាពរីករាយ និងមានថាមពល

ស្រដៀងគ្នា

ពណ៌បីដែលមានភាពភ្លឺនិងភាពច្បាស់ដូចគ្នា ជាមួយពណ៌ដែលនៅជាប់គ្នានៅលើកង់ពណ៌, 30 ដឺក្រេពីគ្នា។ ការផ្លាស់ប្តូរដែលរលូន។

ល្អបំផុតសម្រាប់: ចំណុចប្រទាក់ដែលបានបំផុសពីធម្មជាតិ និងមានភាពស្ងប់ស្ងាត់

ពណ៌តែមួយ

ពណ៌បីដែលមានពណ៌ដូចគ្នាជាមួយតម្លៃភ្លឺ +/-50%។ ស្រស់ស្អាត និងមានភាពឆើតឆាយ។

ល្អបំផុតសម្រាប់: ការរចនាដែលមានភាពទំនេរ និងមានភាពឆើតឆាយ

តេត្រាឌិក

ពណ៌បួនដែលមានពណ៌បំពេញពីរគូ បំបែកដោយ 60 ដឺក្រេនៃពណ៌។

ល្អបំផុតសម្រាប់: គំរូពណ៌ដែលមានភាពសម្បូរបែប និងមានភាពចម្រុះ

គោលការណ៍ទ្រឹស្តីពណ៌

តុល្យភាព

ប្រើពណ៌មួយជាពណ៌ដ៏សំខាន់, គាំទ្រដោយពណ៌រង និងពណ៌បន្ថែមតិចតួច។

ការប្រៀបធៀប

ធានាថាមានការប្រៀបធៀបគ្រប់គ្រាន់សម្រាប់ភាពអានបាន និងភាពងាយស្រួលក្នុងការចូលប្រើ។

ភាពស្របគ្នា

ពណ៌គួរតែធ្វើការជាមួយគ្នាដើម្បីបង្កើតបទពិសោធន៍រូបភាពដែលមានភាពស្របគ្នា។

ឧបករណ៍ពិនិត្យការផ្ទុយពណ៌

សាកល្បងបន្សំពណ៌ដើម្បីធានាថាវាអនុវត្តតាមស្តង់ដារ WCAG សម្រាប់អានអក្សរបាន។

ពណ៌អក្សរ
ពណ៌ផ្ទៃខាងក្រោយ
ការផ្ទុយ
1.00
Fail
អន់ខ្លាំង
អក្សរតូច
✖︎
អក្សរធំ
✖︎
ស្តង់ដារ WCAG
AA:អត្រាផ្ទុយអប្បបរមា 4.5:1 សម្រាប់អក្សរធម្មតានិង 3:1 សម្រាប់អក្សរធំ។ ត្រូវការសម្រាប់គេហទំព័រច្រើន។
AAA:អត្រាផ្ទុយកាន់តែប្រសើរ 7:1 សម្រាប់អក្សរធម្មតានិង 4.5:1 សម្រាប់អក្សរធំ។ សូមណែនាំសម្រាប់ការចូលប្រើបានល្អបំផុត។
ការប្រកួតគ្នាមិនគ្រប់គ្រាន់សម្រាប់ទំហំអក្សរទាំងអស់ - មិនអាចឆ្លើយតបតាមស្តង់ដារ WCAG។

ឧបករណ៍ពិនិត្យភាពខុសគ្នាកម្រិតខ្ពស់

កែសម្រួលដោយប្រើរបាររំកិល ពិនិត្យមើលច្រើន និងច្រើនទៀត

មនុស្សគ្រប់គ្នាគឺជាអ្នកឆ្លាតវៃ។ ប៉ុន្តែប្រសិនបើអ្នកវាយតម្លៃត្រីដោយសមត្ថភាពរបស់វាក្នុងការឡើងដើមឈើ វានឹងរស់នៅជីវិតទាំងមូលរបស់វាដោយជឿថាវាជាអ្នកល្ងង់។

- Albert Einstein

ទ្រង់ទ្រាយបច្ចេកទេស

ទ្រង់ទ្រាយជាក់ស្តែង

វិភាគពណ៌

ឧបករណ៍សម្របសម្រួលពណ៌

វិមាត្របង្កើតសិល្បៈ