วิธีดูรหัสสี (Color Code) บนเว็บเบราว์เซอร์โดยใช้ Google Chrome ง่ายๆ ไม่ต้องติดตั้งโปรแกรม

    หากเพื่อนๆนั้นเป็นนักออกแบบที่กำลังมองหาสีสวยๆไปใช้งาน แต่เผอิญไปเจอเข้ากับเว็บไซต์เว็บไซต์หนึ่งที่ได้ใช้สีที่ตรงกับที่เราชอบพอดี จึงมีเพื่อนๆที่รู้จักกันหลายๆคนถามเข้ามาว่าจะมีวิธีบ้างไหมที่เราจะทราบรหัสสีบนหน้าเว็บนั้นได้ ซึ่ง Admin ก็จะตอบว่า ได้ครับ ซึ่งวิธีการดูรหัสสีมีดังนี้ครับ

วิธีดู code สีบนเว็บเบราว์เซอร์

ขั้นตอนที่ 1. คลิกขวาที่พื้นที่สีที่เราต้องการจะดูรหัสสี แล้วเลือก Inspect element

ขั้นตอนที่ 2. จากนั้นเราจะเห็นหน้าต่างของ Google Chrome Developer tools โผล่ขึ้นมาดังรูปด้านล่าง (บางท่านอาจจะโผล่มาทางด้านขวาของเบราว์เซอร์)

ให้เราสังเกตุที่คำว่า background-color เราก็จะพบรหัสสีที่เราต้องการแล้วล่ะครับ

ขั้นตอนที่ 3. วิธีใช้ tools ของ Google Chrome หารหัสสีให้เราคลิกที่สีเหลี่ยมสี จากนั้นให้เราลองเอาเมาส์ชี้ไปยังที่ต่างๆบนเว็บไซต์เราก็จะเห็นวงกลมสีต่างๆที่ใช้ในการส่องสี ซึ่งหากเพื่อนๆนั้นต้องเจอสีที่ถูกใจแล้วก็สามารถคลิกซ้าย 1 ครั้งเพื่อทำการมาร์ครหัสสี

* (ขออภัยที่ Admin ไม่สามารถ capture รูป tools ดูรหัสสี หน้าจอมาให้ดูได้จึงได้นำโทรศัพท์ถ่ายรูปมาให้ดู ซึ่งอาจจะไม่ค่อยชัด)

จากนั้นให้ดูที่ background-color เราก็จะพบว่ารหัสสีเปลี่ยนไปเป็นรหัสที่เราต้องการแล้วล่ะครับ