CrateX.app

ตัวเลือกสีภาพและพาเลท

คลิกเพื่อเลือกสีจากภาพ แยกสีหลักและพาเลทอัตโนมัติ คัดลอก HEX/RGB และส่งออกตัวแปร CSS รองรับ PNG, JPG/JPEG, WebP, AVIF, HEIC/HEIF

ลากและวางภาพที่นี่หรือคลิกเพื่อเลือก

รองรับ PNG / JPG / JPEG / WebP / AVIF / HEIC / HEIF

เริ่มต้นอย่างรวดเร็ว

นำเข้าภาพ: ลากและวางหรือคลิกเพื่อเลือก

สลับแผง: เดสก์ท็อปแสดงแผงด้านข้าง; มือถือแตะปุ่มด้านล่าง

คลิกเพื่อเลือก: คลิกที่ใดก็ได้บนภาพเพื่อรับสีของพิกเซลนั้น

คัดลอกสี: หลังจากเลือกคัดลอกรูปแบบ HEX/RGB/CSS

ตั้งจำนวนสี: ลากแถบเลื่อนหรือคลิกพรีเซ็ต (4/6/8/12/16/24/32)

แยกพาเลท: คลิกปุ่มแยกเพื่อรับรายการสีหลัก

ส่งออก CSS: หลังจากแยกส่งออกไฟล์ตัวแปร CSS

ส่งออก JSON: หลังจากแยกส่งออกไฟล์ข้อมูล JSON

รีเซ็ต: ล้างภาพปัจจุบันและผลลัพธ์

สถานการณ์การใช้งานทั่วไป

การเลือกสีการออกแบบ/โปสเตอร์

แยกสีหลักและสีเน้นสำหรับชุดสี

ธีม/ระบบการออกแบบ

ส่งออกตัวแปร CSS หรือ JSON สำหรับโปรเจกต์

การจัดแต่งคอมโพเนนต์

แยกสีที่เข้ากันสำหรับปุ่ม แท็ก แผนภูมิ

ความสอดคล้องของแบรนด์

แยกพาเลทสีมาตรฐานจากสินทรัพย์แบรนด์

ตัวเลือกตัวเลือกสีและพาเลท

จำนวนสี: 2–32, ปกติ 8/12; ภาพถ่าย/ไล่ระดับแนะนำ 16–32

ปุ่มพรีเซ็ต: 4/6/8/12/16/24/32 สลับคลิกเดียว

การเรียงลำดับ: ตามเปอร์เซ็นต์จากสูงไปต่ำ สีที่พบบ่อยที่สุดก่อน

ตัวเลขข้างสี: แสดงเปอร์เซ็นต์พิกเซลในภาพ

คำแนะนำการใช้งาน

เริ่มด้วย 8/12 เพื่อดูผลรวม จากนั้นเพิ่มเป็น 16/24/32 ตามต้องการ

เมื่อใช้ในโปรเจกต์ เปลี่ยนชื่อ --color-1 เป็นชื่อที่มีความหมาย (เช่น --color-primary)

รักษาหน้าไว้ด้านหน้าเมื่อแยกภาพขนาดใหญ่เพื่อหลีกเลี่ยงการจำกัดของเบราว์เซอร์

ข้อจำกัดและความเข้ากันได้

จำกัดไฟล์เดี่ยว 128MB ภาพขนาดใหญ่มากอาจทำให้ช้าลง

การแยกพาเลทดาวน์แซมเพิลอัตโนมัติเพื่อประสิทธิภาพ ผลลัพธ์เป็นสีตัวแทน

การถอดรหัส HEIC/HEIF ขึ้นอยู่กับการรองรับของเบราว์เซอร์ แปลงเป็น JPG/PNG หากล้มเหลว

พิกเซลโปร่งใสจะถูกละเว้นหรือประมวลผลเป็น RGBA จริง

ความเป็นส่วนตัวและความปลอดภัย

การประมวลผลทั้งหมดทำในเบราว์เซอร์ของคุณ ข้อมูลไม่ออกจากอุปกรณ์ของคุณ

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

ขั้นตอนถัดไปสามารถทำต่อด้วยเครื่องมือที่เกี่ยวข้องเหล่านี้