ดูดสีจากรูปภาพ
ลากรูปภาพมาวางที่นี่
รูปแบบที่รองรับ: JPG, PNG, WebP, GIFคลิกที่ใดก็ได้บนรูปภาพเพื่อเลือกสี
อยากรู้ว่าสีในโลโก้ รูปถ่าย หรือภาพหน้าจอคือสีอะไร? อัปโหลดรูปภาพ นำเคอร์เซอร์ไปวางบนจุดที่ต้องการ แล้วคลิก รหัสสีจะถูกคัดลอกไปยังคลิปบอร์ดทันทีในรูปแบบที่คุณเลือก HEX, RGB, HSL, HSV หรือ LCH ไม่ต้องติดตั้งอะไร และรูปภาพไม่ออกจากเครื่องของคุณเลย
วิธีดูดสีจากรูปภาพ
- อัปโหลดรูปภาพ ลากไฟล์มาวางในกรอบ หรือคลิก “เลือกไฟล์” รองรับทั้ง JPG, PNG, WebP และ GIF
- เลือกรูปแบบ เหนือรูปภาพเลือกว่าจะคัดลอกสีในรูปแบบไหน เว็บส่วนใหญ่ใช้ HEX ส่วนโปรแกรมกราฟิกมักใช้ RGB เครื่องมือจะจำตัวเลือกไว้ให้
- เลื่อนไปยังสีที่ต้องการ จะมีแว่นขยายแสดงพิกเซลรอบเคอร์เซอร์ ใต้แว่นขยายมีรหัสสีให้ดู
- คลิก รหัสจะอยู่ในคลิปบอร์ดทันที และสีจะถูกบันทึกไว้ในแท็บสีที่เลือก นำไปวางที่ไหนก็ได้ตามต้องการ
อยากลองรูปภาพอื่น? ลากรูปใหม่มาวางทับรูปเดิมได้เลย หรือลบรูปเดิมด้วยไอคอนถังขยะ
ความสามารถของเครื่องมือดูดสีจากรูปภาพ
แว่นขยายที่มองเห็นทุกพิกเซล
เครื่องมือดูดสีทั่วไปแสดงแค่สีใต้เคอร์เซอร์ ทำให้การคลิกให้ตรงขอบตัวอักษรบางๆ เป็นเรื่องเดาสุ่ม แว่นขยายของเราขยายพื้นที่รอบเคอร์เซอร์เป็น 11 x 11 พิกเซล และล้อมกรอบพิกเซลตรงกลางไว้ให้เห็นชัด คุณจึงรู้แน่ชัดว่ากำลังจะคลิกอะไรก่อนคลิกจริง
ซูมได้ถึงระดับพิกเซลเดียว
ใช้ปุ่มบวกลบ หรือเลื่อนล้อเมาส์พร้อมกดปุ่ม Ctrl ค้างไว้ เพื่อซูมภาพได้สูงสุดถึง 64 เท่า เปิดฟังก์ชันตารางแล้วจะเห็นขอบเขตของแต่ละพิกเซลชัดเจน เหมาะกับการคลิกให้ตรงจุดบนไอคอน pixel art หรือตัวอักษรขนาดเล็ก
สีจากต้นฉบับ ไม่ใช่จากภาพย่อ
เครื่องมือออนไลน์หลายตัวย่อภาพก่อนแล้วค่อยอ่านสีจากภาพตัวอย่าง ซึ่งทำให้พิกเซลข้างเคียงปนกัน เครื่องมือของเราทำงานกับภาพที่ความละเอียดเต็ม (สูงสุด 4096 พิกเซลด้านยาว) คุณจึงได้สีที่แท้จริงของพิกเซลนั้น
คัดลอกด้วยคลิกเดียว
ไม่ต้องเลือกข้อความหรือพิมพ์ตัวเลขใหม่ ทุกครั้งที่คลิกบนรูปภาพ รหัสในรูปแบบที่เลือกไว้จะถูกคัดลอกทันที หากต้องการสีเดียวกันในรูปแบบอื่นด้วย รายละเอียดสีจะแสดงครบทั้งห้ารูปแบบ แต่ละแบบมีปุ่มคัดลอกของตัวเอง
จานสีเด่นในภาพ
ทันทีที่อัปโหลดรูปภาพ เครื่องมือจะหาสีที่โดดเด่นที่สุดในภาพได้สูงสุด 8 สี และแสดงไว้ในแท็บสีเด่น เฉดสีที่ใกล้เคียงกันมากจะถูกรวมเข้าด้วยกัน ทำให้ในจานสีไม่มีสีเทาซ้ำกันหลายแบบ ส่วนที่โปร่งใสของไฟล์ PNG จะไม่ถูกนับ จานสีนี้ใช้เป็นจุดเริ่มต้นของโทนสีสำหรับเว็บไซต์ งานพรีเซนต์ หรือโพสต์บนโซเชียลมีเดียได้ดี หากอยากเช็กว่าสีในภาพยังคงคอนทราสต์เพียงพอแม้ไม่มีเฉดสี ลองแปลงรูปภาพเป็นขาวดำดูได้
สีที่เลือกอยู่ในสายตาเสมอ
ทุกสีที่คุณคลิกจะถูกบันทึกไว้ในแท็บสีที่เลือก (ล่าสุด 24 สี) ทำให้เปรียบเทียบหลายจุดในภาพและย้อนกลับไปดูได้ทุกเมื่อ บนหน้าจอขนาดใหญ่ แผงแสดงสีจะอยู่ติดกับรูปภาพพอดี
เมื่อไหร่ที่ต้องใช้รหัสสีจากรูปภาพ
- เว็บไซต์และแอป: ลูกค้าส่งโลโก้มาเป็นไฟล์ JPG เท่านั้น แต่คุณต้องการสีแบรนด์ที่แม่นยำไปใส่ใน CSS หากต้องการเวอร์ชันพื้นหลังโปร่งใสด้วย ใช้เครื่องมือลบพื้นหลังรูปภาพต่อได้เลย
- งานกราฟิกและโซเชียลมีเดีย: อยากให้ตัวอักษรบนโพสต์เข้ากับภาพถ่าย ก็ดูดสีมาจากภาพนั้นโดยตรง
- งานพรีเซนต์และเอกสาร: ตั้งค่าสีโลโก้บริษัทใน PowerPoint, Google Slides หรือ Canva ผ่านค่า HEX หรือ RGB
- ตรวจสอบงานออกแบบ: เช็กจากภาพหน้าจอว่าปุ่มในแอปใช้สีตรงตามที่ดีไซน์กำหนดจริงหรือไม่ จากนั้นตรวจขนาดของไฟล์ภาพที่ส่งออกด้วยเครื่องมือวิเคราะห์ขนาดรูปภาพ
- งานตกแต่งภายในและแฟชั่น: มีรูปผ้าหรือกำแพงและอยากได้เฉดสีใกล้เคียง รหัสสีนี้ใช้เป็นจุดเริ่มต้นตอนเทียบกับแผ่นตัวอย่างสีได้
รูปแบบสีที่ได้จากเครื่องมือดูดสี
- HEX (
#1373b6): รูปแบบที่ใช้ใน HTML, CSS และโปรแกรมกราฟิกส่วนใหญ่ ดูรายละเอียดรูปแบบสั้นและแบบมีค่าอัลฟาได้ที่เอกสาร MDN (ภาษาอังกฤษ) - RGB (
rgb(19, 115, 182)): สัดส่วนของสีแดง เขียว และน้ำเงิน แต่ละค่าอยู่ระหว่าง 0 ถึง 255 หลักการผสมสีแบบบวกอธิบายไว้ในวิกิพีเดีย - HSL (
hsl(205, 81%, 39%)): เฉดสี ความอิ่มตัว และความสว่าง ใช้ปรับให้สีอ่อนลงหรือเข้มขึ้นได้ง่าย - HSV: เฉดสี ความอิ่มตัว และค่าความสว่าง (value) แบบที่คุ้นเคยจากกล่องเลือกสีใน Photoshop หรือ GIMP ความแตกต่างระหว่าง HSL และ HSV อธิบายไว้ในWikipedia (ภาษาอังกฤษ)
- LCH: โมเดลสีที่ใกล้เคียงกับการรับรู้สีของสายตามนุษย์ คัดลอกออกมาในรูปแบบที่ CSS สมัยใหม่เข้าใจ (ดูเอกสาร MDN ภาษาอังกฤษ)
เครื่องมือดูดสีบอกสีในรูปภาพให้คุณ หากต้องการปรับแต่งต่อ แปลงเป็นรูปแบบอื่น หรือหาเฉดสีที่เข้ากัน ไปต่อที่เครื่องมือเลือกสีออนไลน์ได้เลย
คำถามที่พบบ่อย
รูปภาพของฉันถูกอัปโหลดขึ้นเซิร์ฟเวอร์หรือไม่?
ไม่ รูปภาพถูกโหลดและประมวลผลอยู่ในเบราว์เซอร์ของคุณเท่านั้น ไม่มีการส่งไปที่ไหนเลย และหลังจากปิดหน้าเว็บก็ไม่มีอะไรหลงเหลืออยู่ จึงใช้กับไฟล์ภายในหรือแบบร่างงานที่ยังไม่เผยแพร่ได้อย่างสบายใจจะหารหัส HEX ของสีจากภาพถ่ายได้อย่างไร?
อัปโหลดภาพถ่าย เลือกรูปแบบ HEX ไว้เหนือรูปภาพ แล้วคลิกจุดที่มีสีที่ต้องการ รหัส เช่น#75dab2 จะอยู่ในคลิปบอร์ดทันที
ทำไมสีจากภาพถ่ายถึงดูต่างจากสีจริง?
กล้องถ่ายรูปเปลี่ยนสีไปตามแสง สมดุลสีขาว และการบีบอัดไฟล์ เครื่องมือดูดสีจะให้ค่าที่ตรงกับสีที่เก็บอยู่ในไฟล์เป๊ะๆ ดังนั้นกับภาพถ่ายควรคลิกหลายจุดแล้วเทียบกันในแท็บสีที่เลือก และถ้าจะผสมสีทาผนังตามรหัสนี้ ให้ถือว่าเป็นค่าโดยประมาณเท่านั้นเครื่องมือดูดสีใช้งานบนมือถือได้หรือไม่?
ได้ บนหน้าจอสัมผัสแค่แตะจุดในรูปภาพ รหัสสีก็จะถูกคัดลอกเหมือนบนคอมพิวเตอร์ แว่นขยายข้างเคอร์เซอร์จะไม่แสดงบนมือถือ ดังนั้นถ้าต้องการเลือกจุดเล็กๆ ให้ซูมภาพเข้าก่อนHEX กับ RGB ต่างกันอย่างไร?
ทั้งสองแบบอธิบายสีเดียวกัน RGB แสดงด้วยตัวเลขสามชุดตั้งแต่ 0 ถึง 255 ส่วน HEX เขียนตัวเลขชุดเดียวกันในเลขฐานสิบหกตามหลังเครื่องหมาย # เช่นrgb(255, 87, 51) คือค่าเดียวกับ #ff5733