เลือกรหัสสีบนหน้าจอได้ง่าย ๆ ด้วย Color Picker บน Windows
6 มีนาคม 2564
เวลาที่เราออกแบบกราฟฟิกหรือพัฒนา User Interface ใด ๆ การเลือกสีให้ถูกตามที่ Design ออกมาก็เป็นเรื่องสำคัญอย่างยิ่ง บางครั้ง Designer ไม่ได้บอกรหัสสีมาให้เราหรือวิธีการไปดูรหัสสีอาจไม่สะดวกนัก จริง ๆ แล้วใน Windows มี PowerToys ที่มีเครื่องมือ Color Picker ให้เราเลือกรหัสสีจากตำแหน่งบนหน้าจอใด ๆ ด้วยคีย์ลัดและคลิกเดียว
ติดตั้ง PowerToys
ขั้นแรกทำการ Dowlonad PowerToys ได้จาก GitHub นี้ https://github.com/microsoft/PowerToys ใน PowerToys มีเครื่องมือ utilities ที่น่าสนใจหลาย ๆ ตัว เช่น
แน่นอนว่าในบทความนี้จะพามารู้จักกับ Color Picker กัน
เลือกสีด้วย Color Picker
เมื่อติดตั้ง PowerToys แล้ว utilities Color Picker ให้เราเรียกใช้งานได้ด้วยคีย์ลัด Win + Shift + C
นอกจากนี้เมื่อเรากำลังเลือกสีเราสามารถ scroll up เพื่อ zoom ให้เห็น pixel สีที่เราต้องการเลือกได้ชัดขึ้นด้วย
หน้าต่าง Editor
เมื่อเราคลิกตรงตำแหน่งนั้นจะขึ้นหน้าต่าง editor ขึ้นมาบอกรายละเอียดเกี่ยวกับสีที่เราเลือกมากขึ้น
บนหน้าต่าง editor นี้ด้านซ้ายจะแสดงสีที่เราเคยคลิกเก็บเป็นประวัติให้เราด้วยทำให้เราย้อนดูสีที่เราเคยเลือกไว้ได้ง่าย ๆ
ด้านบนจะมีเฉดสีจากสีที่เราเลือก ตรงนี้ก็จะสะดวกเวลาที่เราต้องการเทียบสี เอาไปทำ UI ตอนที่เราต้องการให้สีทึบขึ้นหรือสีอ่อนลงได้สะดวกดีสำหรับ dev ได้เหมือนกัน
ตรงกลางจะมีเลขรหัสสีตาม format ต่าง ๆ ให้เรา copy ไปใช้งานได้เลย
ทีนี้ถ้า format รหัสสีที่เราใช้ประจำนอกเหนือจากที่แสดงใน editor ในหน้าต่าง setting ของ Color Picker เราสามารถ เลือกรหัสสีเพิ่มเติมที่ต้องการให้แสดงในหน้าต่าง Editor ได้เลย
ดูเพิ่มเติม
ถ้าสนใจสามารถลองดูเครื่องมือ utilities อื่น ๆ ที่มาพร้อมกับ PowerToys ได้จาก Website ของ Microsoft ต่อไปนี้
