ຂ້ອຍຈະເອົາລະຫັດ hex ຂອງສີຫຼັກໃນຮູບພາບໄດ້ແນວໃດ?

ລາກ ແລະ ວາງໄຟລ໌ JPEG, PNG, WebP ຫຼື GIF, ຫຼື ວາງຮູບພາບລົງໄປ. ສີຫຼັກຈະປາກົດເປັນແຖບສີພ້ອມລະຫັດ HEX ແລະ ເປີເຊັນ. ຄລິກທີ່ແຖບສີເພື່ອສຳເນົາ, ຫຼື ໃຊ້ ສຳເນົາພາເລດທັງໝົດ.

ຂ້ອຍສາມາດດຶງສີອອກມາໄດ້ຈັກສີ?

ແຖບເລື່ອນ Number of colors ສາມາດເລືອກໄດ້ຕັ້ງແຕ່ 2 ຫາ 16 ສີ. ຈຳນວນສີໜ້ອຍຈະໃຫ້ພາເລດສີກວ້າງໆ, ໃນຂະນະທີ່ຈຳນວນສີຫຼາຍຈະເກັບລາຍລະອຽດຂອງໂທນສີທີ່ລະອຽດຂຶ້ນ. ພິກເຊລທີ່ໂປ່ງໃສທັງໝົດຈະຖືກລະເລີຍ.

ຂ້ອຍສາມາດເລືອກສີຈາກພິກເຊລທີ່ເຈາະຈົງແທນສີຫຼັກໄດ້ບໍ່?

ໄດ້. ກົດ ຮູບ ເພື່ອ ໄດ້ຕົວຢ່າງ pixel color, ແລ້ວສີທີ່ແນ່ນອນໃນຈຸດນັ້ນຈະຖືກເພີ່ມເຂົ້າໃນລາຍການທີ່ທ່ານເລືອກ. ທ່ານສາມາດລຶບສີທີ່ເລືອກອອກໄດ້ດ້ວຍປຸ່ມລຶບຂອງມັນ.

ຂ້ອຍຈະສົ່ງອອກພາເລດສີເປັນ CSS ຫຼື Tailwind ໄດ້ແນວໃດ?

ເລືອກຮູບແບບພາຍໃຕ້ ສົ່ງອອກ ເປັນ: CSS, Tailwind, SCSS ຫຼື JSON, ຈາກນັ້ນກົດ ສໍາເນົາ code. ສ່ວນ ດາວໂຫຼດ PNG strip ຈະບັນທຶກພາເລດເປັນແຖບຮູບພາບຕາມສັດສ່ວນຂອງແຕ່ລະສີ.

ເສັ້ນຄ່າ contrast ຢູ່ກ້ອງແຕ່ລະສີໝາຍເຖິງຫຍັງ?

ມັນສະແດງອັດຕາສ່ວນ contrast ຕາມມາດຕະຖານ WCAG ຂອງຂໍ້ຄວາມສີດຳ ແລະ ຂໍ້ຄວາມສີຂາວເທິງສີນັ້ນໆ, ເຊັ່ນ 4.5:1. ໃຊ້ຄ່ານີ້ເພື່ອເລືອກສີຂໍ້ຄວາມທີ່ອ່ານງ່າຍສຳລັບແຖບສີນັ້ນ.

ຟຣີແທ້ບໍ?

ແມ່ນແລ້ວ. ທຸກເຄື່ອງມືແມ່ນໃຊ້ຟຣີ, ບໍ່ຕ້ອງມີບັນຊີ ແລະ ບໍ່ຕ້ອງໃຊ້ບັດເຄຣດິດ. ການເຮັດວຽກທັງໝົດແມ່ນດຳເນີນຢູ່ໃນອຸປະກອນຂອງທ່ານແທນທີ່ຈະຢູ່ໃນເຊີບເວີຂອງພວກເຮົາ, ເຊິ່ງເຮັດໃຫ້ເຮົາສາມາດໃຫ້ບໍລິການໄດ້ຟຣີ.

ໄຟລ໌ຂອງຂ້ອຍຖືກອັບໂຫຼດບໍ?

ບໍ່. ໄຟລ໌ຂອງທ່ານຖືກເປີດ ແລະ ປະມວນຜົນພາຍໃນບຣາວເຊີຂອງທ່ານ ແລະ ບໍ່ຖືກສົ່ງໄປ LibraTool. ບາງເຄື່ອງມືຈະດາວໂຫຼດເອັນຈິນປະມວນຜົນ ຫຼື ໂມເດວ AI ໄປບຣາວເຊີກ່ອນ; ການດາວໂຫຼດນັ້ນບໍ່ມີຂໍ້ມູນຂອງທ່ານ.

ມັນເຮັດວຽກຢູ່ໃນມືຖືບໍ?

ໄດ້. ມັນເຮັດວຽກໃນບຣາວເຊີມືຖືລຸ້ນໃໝ່ເທິງ iOS ແລະ Android ໂດຍບໍ່ຕ້ອງຕິດຕັ້ງຫຍັງ. ໄຟລ໌ໃຫຍ່ຫຼາຍອາດຊ້າ ຫຼື ໜ່ວຍຄວາມຈຳເຕັມເທິງໂທລະສັບ, ດັ່ງນັ້ນໃຫ້ໃຊ້ຄອມພິວເຕີສຳລັບໄຟລ໌ເຫຼົ່ານັ້ນ.

🎨

ຕົວດຶງ Color Palette ຈາກຮູບ ຟຣີ

ດຶງສີ dominant ຈາກຮູບໃດໆ ດ້ວຍ k-means color quantization. ຮັບ hex code ຂອງ 2-16 ສີຫລັກ ຈາກຮູບ ຫຼື logo.

ຂະໜາດໄຟລ໌ຂຶ້ນກັບອຸປະກອນຂອງທ່ານໄຟລ໌ເປັນສ່ວນຕົວບໍ່ຈໍາເປັນຕ້ອງເຂົ້າສູ່ລະບົບຟຣີຕະຫຼອດໄປ

ເຮັດວຽກແບບອອບໄລນ໌ໄດ້ຫຼັງໂຫຼດແລ້ວ

ວາງໄຟລ໌ບ່ອນນີ້, ຫຼື ກົດເພື່ອເລືອກ

JPG, PNG, WebP, GIF, HEIC, HEIF · ປະມວນຜົນຢູ່ໃນອຸປະກອນຂອງທ່ານ

ຫຼືກົດ Ctrl+V ເພື່ອວາງຈາກຄລິບບອດ

ຊອກຫາໄຟລ໌

ເຄັດລັບ: ທ່ານສາມາດວາງພາບໜ້າຈໍດ້ວຍ Ctrl+V

ໄຟລ໌ຂອງທ່ານບໍ່ເຄີຍອອກຈາກອຸປະກອນຂອງທ່ານ. ການປະມວນຜົນທັງໝົດເກີດຂຶ້ນຢູ່ໃນຕົວທ່ອງເວັບຂອງທ່ານ.

ການນຳໃຊ້ທົ່ວໄປ

ສະກັດສີ ແບຣນ້ັອ ຈາກໂລໂກສະກັດລະຫັດ hex ທີ່ຖືກຕ້ອງ ສຳລັບ ສີທີ່ຕົ້ນ ໃນໂລໂກ ຫຼື ຮູບ ແບຣນ້ັອ ໃດໜຶ່ງ.
ສ້າງ ທີ່ສະຫວ່າງ ຈາກຮູບສ້າງ ທີ່ໄວກາລະ ສໍາລັບເວບໄຊຕ໌ ຈາກ ຮູບກວາງ ຫຼື ຮູບພື້ນຫຼັງ.
ສະກັດສີ ຈາກຮູບ ອະນຸຣູປສະກັດ ທີ່ສະຫວ່າງ ຈາກຮູບ ອະນຸຣູປ ໄຟຟ້າ ຫຼື ແຟຊັ່ນ ເພື່ອ ໃຊ້ໃນ ໂຟຣົ່ມ ຂອງທ່ານ.
ວິເຄາະ ທີ່ໄວກາລະ ຂອງ ຮູບແຕ້ມ ແລະ ສິນລະປະສຶກສາ ທີ່ໄວກາລະ ຂອງຮູບແຕ້ມ ທີ່ມີຊື່ສຽງ ຫຼື ສິນລະປະ ຂອງທ່ານ ໂດຍ ສະກັດ ສີທີ່ຕົ້ນ.
ສະຫວ່າງໄຟ CSS ຈາກຮູບສ້າງທີມ CSS variable ຈາກຮູບພາບ — ມີປະໂຫຍດສຳລັບທີມແບບໄດນາມິກ ຫຼື ຊຸດສີທີ່ສ້າງອັດຕະໂນມັດ.

ມັນເຮັດວຽກແນວໃດ

ການສະກັດສີເຮັດວຽກທັງໝົດພາຍໃນບຣາວເຊີຂອງທ່ານໂດຍໃຊ້ອະລະກໍລິທຶມການຈັດກຸ່ມ k-means++ ທີ່ຂຽນເອງ ນຳໃຊ້ກັບຂໍ້ມູນ pixel ດິບທີ່ອ່ານຈາກ Canvas API — ບໍ່ມີເຊີບເວີ, ບໍ່ມີໄລບຣາຣີພາຍນອກ. ຮູບພາບ ແລະ ການຕັ້ງຄ່າຈຳນວນສີດຽວກັນຈະໃຫ້ຊຸດສີດຽວກັນສະເໝີ ເນື່ອງຈາກອະລະກໍລິທຶມໃຊ້ຕົວສ້າງເລກສຸ່ມທຽມແບບຄົງທີ່ (mulberry32) ແທນທີ່ Math.random.

1
Canvas ອ່ານຂໍ້ມູນ pixel
ຮູບພາບຖືກແຕ້ມລົງໃນອົງປະກອບ HTML Canvas ນອກໜ້າຈໍ ແລະ ຫຼຸດຂະໜາດລົງໃຫ້ບໍ່ເກີນ 200px ໃນດ້ານທີ່ຍາວທີ່ສຸດ. ຟັງຊັນ getImageData() ຂອງ Canvas API ຈະສົ່ງຄືນທຸກ pixel ເປັນໄບຕ໌ RGBA ດິບ, ແລະ pixel ທີ່ໂປ່ງໃສທັງໝົດ (alpha < 128) ຈະຖືກຖິ້ມກ່ອນເລີ່ມການຈັດກຸ່ມ.
2
k-means++ ຈັດກຸ່ມ pixel
ຕົວກຳນົດຄ່າເລີ່ມຕົ້ນ k-means++ ຈະຕັ້ງຄ່າ centroid ແບບຄົງທີ່, ຈາກນັ້ນອະລະກໍລິທຶມຈະວົນຊ້ຳສູງສຸດ 20 ຄັ້ງ: ແຕ່ລະ pixel ຖືກມອບໝາຍໃຫ້ centroid ທີ່ໃກ້ທີ່ສຸດໃນພື້ນທີ່ RGB, ຈາກນັ້ນ centroid ຖືກຄິດໄລ່ໃໝ່ເປັນຄ່າສະເລ່ຍຂອງ pixel ທັງໝົດທີ່ຖືກມອບໝາຍ. ກຸ່ມທີ່ຫຼຸບລົງເປັນຄ່າເລກຖານ 16 ດຽວກັນຈະຖືກລວມກັນ, ດັ່ງນັ້ນແຕ່ລະສີໃນຜົນລັບຈຶ່ງບໍ່ຊ້ຳກັນ.
3
ຂໍ້ມູນລະອຽດຕໍ່ສີຖືກຄິດໄລ່
ແຕ່ລະ centroid ຖືກແປງເປັນ HEX, HSL, ແລະ ອັດຕາສ່ວນຂອງ pixel ທັງໝົດ (ເປີເຊັນ). ຄວາມສະຫວ່າງສຳພັດ WCAG ຖືກຄິດໄລ່ຕາມສູດມາດຕະຖານ, ແລະ ອັດຕາສ່ວນຄວາມແຕກຕ່າງກັບທັງສີດຳ ແລະ ສີຂາວຖືກສະແດງຄຽງຄູ່ກັບແຕ່ລະສີ.
4
ຜົນລັບການສົ່ງອອກ ແລະ ຕົວດູດສີ
ຊຸດສີສາມາດຄັດລອກເປັນ CSS custom properties, ຕົວແປ SCSS, ໂຄ້ດ Tailwind config, ຫຼື JSON. ຕົວດູດສີແບບກົດເລືອກແມັບການກົດຂອງທ່ານໃນຕົວຢ່າງກັບຄືນໄປຫາຕຳແໜ່ງ pixel ຕົ້ນສະບັບແທ້ໆເທິງ canvas ຄວາມລະອຽດເຕັມ, ເພີ່ມສີຂອງ pixel ນັ້ນລົງໃນລາຍການສີທີ່ເລືອກແຍກຕ່າງຫາກ. ແຖບຊຸດສີແບບ PNG ສາມາດດາວໂຫຼດໄດ້ຜ່ານ Canvas toBlob().

ຮູບຂອງທ່ານບໍ່ເຄີຍຖືກອັບໂຫຼດ — ມັນຖືກຖອດລະຫັດ ແລະ ປະມວນຜົນທັງໝົດພາຍໃນໜ່ວຍຄວາມຈຳຂອງບຣາວເຊີ, ແລະ ມີພຽງຂະໜາດໄຟລ໌ (ເປັນ KB) ເທົ່ານັ້ນທີ່ຖືກລາຍງານໄປຫາ analytics.