เลือกรหัสสีบนหน้าจอบน Windows ด้วย Color Picker

6 มีนาคม 2564 เวลาอ่าน 7 นาที
เลือกรหัสสีบนหน้าจอบน Windows ด้วย Color Picker

เวลาที่เราออกแบบกราฟฟิกหรือพัฒนา User Interface ใด ๆ การเลือกสีให้ถูกตามที่ Design ออกมาก็เป็นเรื่องสำคัญอย่างยิ่ง บางครั้ง Designer ไม่ได้บอกรหัสสีมาให้เราหรือวิธีการไปดูรหัสสีอาจไม่สะดวกนัก จริง ๆ แล้วใน Windows มี PowerToys ที่มีเครื่องมือ Color Picker ให้เราเลือกรหัสสีจากตำแหน่งบนหน้าจอใด ๆ ด้วยคีย์ลัดและคลิกเดียว

ติดตั้ง PowerToys

ขั้นแรกทำการ Dowlonad PowerToys ได้จาก GitHub นี้ https://github.com/microsoft/PowerToys ใน PowerToys มีเครื่องมือ utilities ที่น่าสนใจหลาย ๆ ตัว เช่น

แน่นอนว่าในบทความนี้จะพามารู้จักกับ Color Picker กัน

หน้าจอ Setting Color ของ Color Picker ใน PowerToys

เลือกสีด้วย Color Picker

เมื่อติดตั้ง PowerToys แล้ว utilities Color Picker ให้เราเรียกใช้งานได้ด้วยคีย์ลัด Win + Shift + C

เมื่อเลื่อนเมาส์จะแสดง tooltip สีที่อยู่ใต้เมาส์เราทันที

นอกจากนี้เมื่อเรากำลังเลือกสีเราสามารถ scroll up เพื่อ zoom ให้เห็น pixel สีที่เราต้องการเลือกได้ชัดขึ้นด้วย

scroll up เพื่อ zoom

หน้าต่าง Editor

เมื่อเราคลิกตรงตำแหน่งนั้นจะขึ้นหน้าต่าง editor ขึ้นมาบอกรายละเอียดเกี่ยวกับสีที่เราเลือกมากขึ้น

เราสามารถ คลิก Copy to clipboard เพื่อนำรหัสสีที่ต้องการไปใช้ได้เลย

บนหน้าต่าง editor นี้ด้านซ้ายจะแสดงสีที่เราเคยคลิกเก็บเป็นประวัติให้เราด้วยทำให้เราย้อนดูสีที่เราเคยเลือกไว้ได้ง่าย ๆ

ด้านบนจะมีเฉดสีจากสีที่เราเลือก ตรงนี้ก็จะสะดวกเวลาที่เราต้องการเทียบสี เอาไปทำ UI ตอนที่เราต้องการให้สีทึบขึ้นหรือสีอ่อนลงได้สะดวกดีสำหรับ dev ได้เหมือนกัน

ตรงกลางจะมีเลขรหัสสีตาม format ต่าง ๆ ให้เรา copy ไปใช้งานได้เลย

ทีนี้ถ้า format รหัสสีที่เราใช้ประจำนอกเหนือจากที่แสดงใน editor ในหน้าต่าง setting ของ Color Picker เราสามารถ เลือกรหัสสีเพิ่มเติมที่ต้องการให้แสดงในหน้าต่าง Editor ได้เลย

ดูเพิ่มเติม

ถ้าสนใจสามารถลองดูเครื่องมือ utilities อื่น ๆ ที่มาพร้อมกับ PowerToys ได้จาก Website ของ Microsoft ต่อไปนี้

เรื่องใน
Phattarachai Chaimongkol

เกี่ยวกับ phattarachai.dev

ผมอ๊อฟนะครับ เป็นผู้ประกอบการอิสระ ที่ปรึกษาทางด้าน Web Application Development ให้แก่องค์กร ธุรกิจ SME และหน่วยงานราชการ
Web Developer ผู้มีใจรักใน Laravel เป็นพาร์ทเนอร์บริษัท Digital Agency ชั้นนำทางด้าน UX/UI เพื่อพัฒนาโปรเจคให้แก่ลูกค้า ผมช่วยสร้างเครื่องมือทางด้าน Web ที่มีคุณภาพให้ผู้ประกอบการดำเนินธุรกิจได้ง่ายขึ้นใช้งานได้จริง เน้นประสบการณ์ ความชำนาญ ผลงานคุ้มค่าเทียบเท่าจ้างงานกับบริษัทใหญ่ ๆ

ยามว่าง ๆ ชอบเล่นเกมส์บน Steam ครับ

เรื่องที่เกี่ยวข้อง

PHP function แสดงขนาดไฟล์แบบคนอ่านรู้เรื่อง เป็น KB, MB, GB
6 มีนาคม 2564
PHP function แสดงขนาดไฟล์แบบคนอ่านรู้เรื่อง เป็น KB, MB, GB
คำสั่ง Postgresql ที่เอาไว้ใช้จัดการเกี่ยวกับ Replication
6 มีนาคม 2564
คำสั่ง Postgresql ที่เอาไว้ใช้จัดการเกี่ยวกับ Replication
สรุป Taylor Otwell Keynote ใน Laracon US 2024 - Inertia 2.0, VS Code Extension และ Laravel Cloud
6 มีนาคม 2564
สรุป Taylor Otwell Keynote ใน Laracon US 2024 - Inertia 2.0, VS Code Extension และ Laravel Cloud