ตัวเลือกสีภาพ
การพยายามหาสีของแบรนด์จากภาพหน้าจอโลโก้ หรือสีผนังจากภาพถ่าย มักต้องเปิดโปรแกรม Photoshop โดยเครื่องมือนี้จะโหลดภาพใดๆ เข้าไปในพื้นที่แสดงผลที่สามารถซูมได้ และแสดงค่า HEX, RGB และ HSL ของพิกเซลที่คุณคลิก โดยแสดงค่าเฉลี่ยในบริเวณขนาด 10×10 พิกเซล เพื่อให้คุณสามารถตรวจสอบคุณภาพของพื้นที่ทั้งหมดแทนที่จะแค่พิกเซลเดียว และช่วยหลีกเลี่ยงปัญหาเสียงรบกวนจากไฟล์รูปแบบ JPEG
วิธีเลือกสีจากภาพ
-
1
อัปโหลดหรือวางรูปภาพ
JPG, PNG, WebP, ตัวเลือกไฟล์จะปรับขนาดให้เข้ากับพื้นที่แสดงผลของคุณ
-
2
ซูมเข้าไปยังพื้นที่นั้น
เลื่อนหน้าจอเพื่อซูม หรือลากเพื่อเลื่อนไปยังตำแหน่งที่คุณต้องการเก็บข้อมูล
-
3
คลิกที่พิกเซล
แสดงผลทันทีในรูปแบบ HEX, RGB, HSL พร้อมตัวอย่างสีขยายใหญ่
-
4
คัดลอกสัญลักษณ์ที่คุณต้องการ
คลิกเพียงครั้งเดียวจะคัดลอกค่า HEX, rgb() หรือ hsl() ไปยังคลิปบอร์ดของคุณ
-
5
บันทึกตัวอย่างหลายชุด
รวบรวมชุดสีจำนวน 6–10 สีจากทั่วภาพ เพื่อใช้เป็นข้อมูลอ้างอิงในการออกแบบ
การเก็บตัวอย่างที่มีความแม่นยำ
การเลือกสีจากพิกเซลเดียวแทบจะไม่ใช่สิ่งที่คุณต้องการจากภาพถ่ายจริงเลย เพราะการบีบอัดแบบ JPEG สัญญาณรบกวน และความแปรปรวนของแสง ทำให้เกิดความแตกต่างระหว่างพิกเซล แม้ในบริเวณที่ดูสม่ำเสมอด้วยสายตาก็ตาม
โหมดการสุ่มตัวอย่าง
| โหมด | ทำหน้าที่อย่างไร | เหมาะสำหรับใช้เมื่อใด |
|---|---|---|
| จุด | พิกเซลเดียวใต้เคอร์เซอร์ | การสุ่มตัวอย่างภาพหน้าจอจากเครื่องมือออกแบบ |
| ค่าเฉลี่ย 3 × 3 พิกเซล | ค่าเฉลี่ยของพิกเซล 9 จุดรอบตำแหน่งที่คลิก | รูปภาพแบบ JPG ที่มีการบีบอัดข้อมูลภาพในระดับต่ำ |
| ค่าเฉลี่ย 10 × 10 พิกเซล | มูลค่าเฉลี่ยของพิกเซล 100 ตัว | รูปภาพที่ถูกบีบอัดอย่างรุนแรงหรือมีสัญญาณรบกวน |
| พื้นที่เฉลี่ย | วาดสี่เหลี่ยมผืนผ้า แล้วหาค่าเฉลี่ยของพิกเซลทุกจุดภายใน | โลโก้และองค์ประกอบการออกแบบที่ใช้สีเรียบ |
ข้อควรระวังเกี่ยวกับพื้นที่สี
- ภาพหน้าจอจากจอแสดงผลจะแสดงค่า sRGB โดยสีที่เลือกจะตรงกับสีต้นฉบับ
- ภาพถ่ายจากกล้องอาจอยู่ในรูปแบบสี Adobe RGB หรือ DCI-P3 แต่เครื่องมือจะแสดงผลเป็น sRGB ดังนั้นสีแดงสดจากภาพถ่ายมือถือที่มีช่วงสีกว้างจึงอาจดูอิ่มตัวน้อยลงเล็กน้อย
- ไฟล์ PNG ที่ใช้โปรไฟล์ ICC: โปรแกรมจะแปลงข้อมูลเป็นรูปแบบ sRGB ก่อนการสุ่มตัวอย่าง เพื่อให้ผลลัพธ์สม่ำเสมอ
กรณีการใช้งานทั่วไป
- จับคู่สีโลโก้ของลูกค้าจากภาพหน้าจอโดยตรง แทนที่จะต้องเดา
- สร้างพาเลทสีจากภาพอ้างอิง (ภาพทิวทัศน์ มู้ดบอร์ด หรือภาพนิ่งจากภาพยนตร์)
- ตรวจสอบค่า HEX บนหน้าเว็บที่แสดงผลแล้วแต่สูญเสียโทเคนการออกแบบไป
- ตรวจสอบว่าผู้มีส่วนได้ส่วนเสียนำสีของแบรนด์ไปใช้อย่างถูกต้องหรือไม่
ความเป็นส่วนตัว
ภาพจะถูกโหลดเข้าไปในหน้าจอเบราว์เซอร์ของคุณโดยไม่ได้ถูกอัปโหลดใดๆ เลย เพราะระบบเลือกใช้การอ่านข้อมูลจากหน้าจอเฉพาะฝั่งไคลเอนต์เท่านั้น ทำให้การออกแบบที่เป็นความลับยังคงรักษาความลับไว้อย่างมั่นคง
คำถามที่พบบ่อย
การบีบอัดรูปแบบ JPEG จะทำให้สีเปลี่ยนแปลงเล็กน้อย โดยเฉพาะในบริเวณที่มีการเปลี่ยนสีค่อยเป็นค่อยไป (gradient) และใกล้ขอบภาพ หากไฟล์ต้นทางเป็นรูปแบบ JPG ควรใช้โหมดคำนวณค่าเฉลี่ย 10 × 10 ส่วนหากมีไฟล์ต้นฉบับในรูปแบบ PNG หรือ SVG ก็สามารถใช้ข้อมูลจากไฟล์ดังกล่าวเพื่อให้ผลลัพธ์ตรงกันอย่างแม่นยำ
ไม่ได้โดยตรง ให้ถ่ายภาพหน้าจอของเฟรมที่ต้องการแล้วนำมาใช้ สำหรับงานแปลงวิดีโอเป็นพาเลทสีอย่างละเอียด ให้ใช้เครื่องมือวิดีโอดึงเฟรมออกมาและสุ่มตัวอย่างทีละเฟรม
ระบบจะสุ่มตัวอย่างข้อมูลจากเฟรมใดก็ตามที่แสดงขณะที่คุณคลิก หากต้องการ จะสามารถหยุดหรือเลื่อนไปยังเฟรมที่ต้องการก่อนทำการสุ่มตัวอย่างได้
สูงสุด 20 สีต่อเซสชัน พาเลทจะถูกจัดเก็บไว้ในเครื่องของคุณ ดังนั้นการรีเฟรชหน้าเว็บจะไม่ทำให้พาเลทหายไป แต่หากล้างข้อมูลเบราว์เซอร์ พาเลทก็จะถูกลบ
เครื่องมือที่เกี่ยวข้อง
เครื่องมือสร้าง QR Code
สร้าง QR Code จากข้อความหรือ URL ในเบราว์เซอร์ แล้วดาวน์โหลดเป็น PNG
เครื่องสร้างบาร์โค้ด
สร้างบาร์โค้ด Code 128, EAN-13, UPC, ITF-14 และรูปแบบเชิงเส้นอื่นอีกเจ็ดแบบ ข้อมูลอยู่ในเบราว์เซอร์และดาวน์โหลดเป็น SVG หรือ PNG ได้
แปลง WebP เป็น JPG
แปลงรูปภาพ WebP เป็น JPG/JPEG ได้โดยตรงในเบราว์เซอร์ เลือกคุณภาพ ผสานความโปร่งใสเข้ากับสีพื้นหลัง แล้วดาวน์โหลดโดยไม่ต้องอัปโหลดไฟล์
เครื่องมือสร้างมีม
อัปโหลดรูป JPG, PNG หรือ WebP ใส่ข้อความด้านบนและด้านล่าง ปรับฟอนต์ สี และเส้นขอบ แล้วดาวน์โหลดมีมเป็น PNG โดยประมวลผลในเบราว์เซอร์
ตัวสร้าง GIF
แปลงชุดรูปภาพหรือวิดีโอสั้นให้เป็น GIF เคลื่อนไหว ปรับอัตราเฟรม จำนวนรอบการเล่น และขนาดก่อนส่งออก
BMP เป็น PNG
แปลงไฟล์ BMP เป็น PNG ในเบราว์เซอร์ แบบไม่สูญเสียคุณภาพ คงความลึกของสี และเพิ่มความโปร่งใสจากช่อง alpha ของ BMP ต้นฉบับได้