วิธีระบุสีบนหน้าจอคอมพิวเตอร์

โลกดิจิทัลแปลงสีรอบตัวเราให้เป็นตัวอักษรและตัวเลขผสมกัน หากต้องการฉกฉวยสีใด ๆ ที่คุณชอบ คุณเพียงแค่ต้องได้รับรหัสของมัน และคุณจะสามารถทำซ้ำได้

สีที่เจาะจงดึงดูดสายตาของคุณขณะท่องเว็บหรือไม่? หรือคุณจำเป็นต้องใช้เฉดสีเฉพาะในการออกแบบของคุณเพื่อให้สิ่งต่างๆ สอดคล้องกัน? ต่อไปนี้คือวิธีการจับรหัส RGB หรือ HEX ของพิกเซลใดๆ บนหน้าจอของคุณ

ระบุค่า RGB หรือ HEX ของสีบนหน้าจอ

การระบุค่า RGB หรือ HEX ของสีบนหน้าจอไม่จำเป็นต้องใช้สายตาจากผู้เชี่ยวชาญหรือเครื่องมือราคาแพง บนพีซี มีวิธีง่ายๆ หลายวิธีในการรับรหัสสีของคุณ

ใช้แอปพีซี

วิธีแรกในการรับสีจากหน้าจอของคุณคือการใช้แอพคอมพิวเตอร์ คุณอาจมีแอปนี้บนพีซีของคุณแล้ว

Eyedropper ทันทีสำหรับ Windows

หากคุณจำเป็นต้องคว้ารหัสสีบ่อยๆ การมีเครื่องมือง่ายๆ อยู่ในมือจะทำให้ชีวิตของคุณง่ายขึ้น Instant Eyedropper เป็นแอปฟรีสำหรับ Windows โดยเฉพาะ ณ ตอนนี้

เมื่อคุณติดตั้งแล้ว คุณจะสามารถเข้าถึงได้จากซิสเต็มเทรย์ของคุณ เพียงกดปุ่มซ้ายของเมาส์ค้างไว้บนสีที่คุณเลือก จากนั้นปล่อย แอพจะคัดลอกรหัสสีไปยังคลิปบอร์ดของคุณทันที และคุณสามารถวางลงในโปรแกรมใดก็ได้ที่คุณต้องการ Eyedropper ทันทีทำงานบน Windows XP-10

เครื่องวัดสีดิจิตอลสำหรับ Mac

Digital Color Meter เป็นเครื่องมือที่คล้ายกันซึ่งติดตั้งไว้ล่วงหน้าในอุปกรณ์ Mac เปิดโฟลเดอร์ Applications ของคุณและค้นหา Utilities เครื่องมือ Digital Color Meter ควรอยู่ที่นั่น

การเรียกใช้แอปนี้จะทำให้เคอร์เซอร์ของคุณกลายเป็นหลอดดูดสี คุณสามารถใช้เพื่อรับสีใดก็ได้จากหน้าจอของคุณ แอพจะแสดงค่า RGB ตามค่าเริ่มต้น คุณสามารถคัดลอกสิ่งเหล่านี้และแปลงเป็น HEX ในภายหลังหรือปรับแต่งตัวเลือกเพื่อให้ได้สีที่คุณต้องการ

SIP สำหรับ Mac

หากคุณต้องการเครื่องมือขั้นสูง คุณสามารถดู SIP ซึ่งมีให้สำหรับ Mac SIP เป็นมากกว่าเครื่องมือเลือกสี นอกจากนี้ยังมีคุณสมบัติขั้นสูงมากมายที่นักออกแบบเว็บไซต์ทุกคนจะต้องประทับใจ คุณสามารถแก้ไขสีของคุณได้อย่างง่ายดาย จัดระเบียบเป็นจานสี และเปลี่ยนรูปแบบให้เหมาะกับความต้องการของคุณ

น่าเสียดายที่SIPไม่ใช่เครื่องมือฟรี แต่ให้ทดลองใช้ฟรี คุณสามารถลองใช้เพื่อดูว่าคุณสมบัติพิเศษนั้นคุ้มค่ากับเงินของคุณหรือไม่

ข้อดีของแอพเดสก์ท็อปเหล่านี้คือสามารถดึงสีจากส่วนใดก็ได้บนหน้าจอของคุณ เครื่องมือเบราว์เซอร์ด้านล่างนี้สามารถทำได้ภายในหน้าเว็บเท่านั้น แน่นอน คุณสามารถข้ามข้อจำกัดนี้ได้โดยอัปโหลดรูปภาพหรือภาพหน้าจอเพื่อดูในเบราว์เซอร์ของคุณ

ใช้เบราว์เซอร์ของคุณ

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

จะหาเครื่องมือเลือกสีของ Firefox ได้จากที่ใด:

1. เปิด Firefox และเปิดเว็บไซต์ที่คุณต้องการแยกรหัสสี
   
2. คลิกเมนูเบราว์เซอร์ของคุณ (เส้นแนวนอนสามเส้น) ที่มุมขวาบน
   
3. ค้นหาเครื่องมือสำหรับนักพัฒนาเว็บในตัวเลือกต่างๆ อาจอยู่ภายใต้ "เครื่องมือเพิ่มเติม"
   
   
4. หน้าต่างจะเปิดขึ้นที่ด้านล่างของหน้า ค้นหาไอคอนหลอดหยด แล้วคุณจะสามารถคัดลอกรหัสสีได้ด้วยการคลิกเพียงครั้งเดียว
   

ขั้นตอนจะคล้ายกันใน Chrome:

1. เปิด Chrome และเปิดเว็บไซต์ที่คุณต้องการ
   
   
2. คลิกเมนู (จุดแนวตั้งสามจุด) ที่มุมขวาบน แล้วหา "เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์" ใต้ "เครื่องมือเพิ่มเติม"
   
3. หน้าต่างจะเปิดขึ้นทางด้านขวาของหน้า ค้นหาและคลิก "สไตล์" ในส่วนที่สอง
   
4. ภายใต้ "เนื้อหา" คุณจะเห็นกล่องสีต่างๆ คลิกที่ใดก็ได้เพื่อเปิดใช้งานตัวเลือกสี
   

เคล็ดลับ: คุณยังสามารถเปิดเครื่องมือสำหรับนักพัฒนาในทั้งสองเบราว์เซอร์ได้ด้วยการคลิกขวาที่หน้าใดก็ได้แล้วเลือก “ตรวจสอบ”

ใช้ส่วนขยายเบราว์เซอร์

นอกจากเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์แล้ว คุณยังสามารถใช้ส่วนขยายเบราว์เซอร์ที่มีประโยชน์เพื่อเลือกสีใดก็ได้จากหน้าเว็บ ตรวจสอบส่วนขยายต่อไปนี้ที่ทำงานทั้งหมด:

• คัลเลอร์ซิลล่า
  
• น้ำยาหยอดตา ColorPick
  
• ยาหยอดตา
  

ใช้เว็บไซต์

คุณไม่จำเป็นต้องมีแอปหรือส่วนขยายเพื่อระบุรหัส RGB หรือ HEX สำหรับสี หากคุณมีภาพเฉพาะที่คุณต้องการดึงสีออกมา คุณสามารถใช้เว็บไซต์ได้เช่นกัน เว็บไซต์นับไม่ถ้วนอนุญาตให้คุณอัปโหลดรูปภาพ แยกรหัสสี หรือแม้กระทั่งสร้างจานสีที่กลมกลืนกัน

เครื่องมือเลือกสีของรูปภาพ PineTools

ค้นหาเครื่องมือ Image Color Picker บน เว็บไซต์ PineToolsและอัปโหลดรูปภาพของคุณ ซูมเข้าหากจำเป็นเพื่อค้นหาพิกเซลที่คุณต้องการจับ คุณจะได้รับค่า RGB และรหัส HEX ด้วยการคลิกง่ายๆ

ตัวเลือกสีของภาพ

เว็บไซต์ Image Color Pickerมีตัวเลือกอื่น ๆ มากมายนอกเหนือจากการอัปโหลดรูปภาพ คลิก “ใช้รูปภาพของคุณ” แล้วเลือกตำแหน่งที่คุณต้องการนำเข้ารูปภาพ คุณสามารถคลิกส่วนใดก็ได้ของรูปภาพเพื่อเลือกสีที่ต้องการ แต่เว็บไซต์ยังแนะนำจานสีตามรูปภาพอีกด้วย

เครื่องมือค้นหาสีของภาพ

นอกจากเครื่องมือเลือกสีธรรมดาแล้วImage Color Finderยังทำหน้าที่เป็นเครื่องมือสร้างสรรค์ได้อีกด้วย คุณสามารถทำให้รูปภาพที่อัปโหลดเป็นพิกเซลเพื่อดูภาพรวมที่ดีขึ้นของสีและซูมเข้าได้มากเท่าที่คุณต้องการ ไซต์ยังแนะนำสีสองสามสีโดยอัตโนมัติ

ถ่ายภาพหน้าจอ

สุดท้าย คุณสามารถระบุรหัสสีได้โดยไม่ต้องใช้เครื่องมือทั้งหมดที่กล่าวมาข้างต้น คุณจะถ่ายภาพหน้าจอและเลือกสีจากที่นั่นแทน

1. ตรวจสอบให้แน่ใจว่าสีที่คุณต้องการเลือกปรากฏบนหน้าจอของคุณ
2. ถ่ายภาพหน้าจอโดยกดปุ่ม Print Screen บนแป้นพิมพ์ (PrntScr, PrtScn ฯลฯ) บน Windows หรือกด “Shift + Command + 3” ค้างไว้พร้อมกันบน Mac ภาพหน้าจอของคุณจะถูกคัดลอกไปยังคลิปบอร์ดโดยอัตโนมัติ
   
   เคล็ดลับ: คุณยังสามารถจับภาพหน้าจอเพียงบางส่วนได้ บน Windows ให้เปิด Snipping Tool จากเมนู Start บน Mac ให้ใช้ทางลัด “Shift + Command + 4”
3. เปิด MS Paint (หรือแอปประมวลผลรูปภาพอื่นๆ) แล้ววางภาพหน้าจอ
4. ค้นหาเครื่องมือ eyedropper และเลือกสี
   
5. คลิก "แก้ไขสี" ถัดจากจานสีใน MS Paint ภายใต้แถบเลื่อน คุณจะเห็นค่า RGB ของสีปัจจุบันของคุณ
   หากต้องการเปลี่ยนตัวเลขเหล่านี้ให้เป็นรหัส HEX คุณจะต้องขอความช่วยเหลือจากเว็บไซต์
6. มุ่งหน้าไปที่RGB ถึง HEXและป้อนค่าในช่องที่เหมาะสม
   
7. คลิก “แปลงเป็นเลขฐานสิบหก” และคุณจะได้รับรหัสของคุณ
   

คำถามที่พบบ่อยเพิ่มเติม

RGB และ HEX ต่างกันอย่างไร? ฉันต้องการอันไหน

รหัส RGB และ HEX แสดงสีเดียวกัน อย่างไรก็ตาม รหัสที่คุณต้องการจะขึ้นอยู่กับวัตถุประสงค์ในการใช้งาน รหัส RGB จะบอกหน้าจอของคุณเกี่ยวกับปริมาณแสงสีแดง สีเขียว และสีน้ำเงินที่จะเปล่งออกมาเพื่อให้ได้สีที่ต้องการ รหัส HEX ส่งข้อมูลเดียวกันแต่เป็นภาษาของการเข้ารหัส

นักออกแบบหรือนักพัฒนามักจะต้องการรหัสสี HEX

ฉันจะระบุสีบนอุปกรณ์เคลื่อนที่ได้อย่างไร

หากต้องการเลือกสีจากหน้าจออุปกรณ์เคลื่อนที่ คุณสามารถดาวน์โหลดแอปหรือใช้หนึ่งในเว็บไซต์ที่กล่าวถึงข้างต้น นอกจากนี้ยังมีเครื่องมือเลือกสีสำหรับ iOS ภายในเครื่องมือมาร์กอัป มันสามารถให้รหัสสี HEX แก่คุณได้เช่นกัน

รับสีใด ๆ ที่คุณเห็นด้วยการคลิกเพียงครั้งเดียว

การใช้รหัสสี RGB หรือ HEX ช่วยให้มั่นใจได้ว่าจะไม่มีโอกาสเกิดข้อผิดพลาด ด้วยภาษาสีที่เป็นสากลเหล่านี้ คุณสามารถคงการออกแบบของคุณให้สอดคล้องกับเฉดสีเดียวกันได้ เนื่องจากมีหลายวิธีในการแยกรหัสสีบนหน้าจอ คุณเพียงแค่ต้องหาวิธีที่ง่ายที่สุดสำหรับคุณ

คุณชอบเครื่องมือเลือกสีแบบใด หรือคุณมีวิธีอื่นที่เชื่อถือได้เพื่อเพิ่ม? แจ้งให้เราทราบด้านล่าง