🎨 เครื่องมือสร้างโทนสี

เกี่ยวกับ

เครื่องมือนี้สร้างพาเลทสี 5 สีใน 3 วิธี: สร้างจากโหมดความกลมกลืน 4 แบบ (สุ่ม, สีที่คล้ายกัน, สีตรงข้าม, สีสามสี); พิมพ์คำอธิบายอารมณ์ เช่น พระอาทิตย์ตก มหาสมุทร หรือไซเบอร์พังก์ เพื่อได้พาเลทในสไตล์นั้น; หรือดึงสีหลัก 5 สีจากภาพใดก็ได้ที่เลือก — ประมวลผลภาพในเครื่องด้วยเทคนิค median-cut quantization ผลลัพธ์ทุกสีเป็นสีที่ปรากฏจริงในภาพ และไม่มีการอัปโหลดใดๆ ทั้งสิ้น ยึดสีแต่ละสีไว้เพื่อให้คงอยู่ตลอดการสร้างใหม่; ในโหมด สีที่คล้ายกัน, สีตรงข้าม และ สีสามสี สร้างสีอื่นโดยรอบโทนของสีที่ยึดไว้เป็นอันดับแรก คัดลอกโค้ด HEX ใดๆ หรือส่งออกพาเลททั้งหมดในรูปแบบที่ต้องการ: รายการ HEX ธรรมดา, ตัวแปร CSS, ชิ้นส่วนสี Tailwind, อาร์เรย์ JSON หรือโทเคนออกแบบ Figma ทุกอย่างทำงานในเบราว์เซอร์ ดังนั้นข้อมูลสีหรือภาพไม่ส่งออกจากเครื่องเลย — ไม่มีเซิร์ฟเวอร์ ไม่มีบัญชี แต่ละสียังแสดงหมายเลข PANTONE Solid Coated ที่ใกล้ที่สุด (เช่น PANTONE 185 C) ดังนั้นพาเลทที่สร้างขึ้นหรือได้จากภาพสามารถนำไปสู่ขั้นตอนการพิมพ์ได้โดยตรง

วิธีใช้งาน

1. เลือกโหมดความกลมกลืน — สุ่ม, สีที่คล้ายกัน, สีตรงข้าม, หรือ สีสามสี — จากเมนูแบบเลือก
2. คลิกที่ปุ่ม สร้าง (หรือกดปุ่ม Spacebar) เพื่อสร้างพาเลทสี 5 สีใหม่
3. คลิกที่ไอคอนล็อกบนสีใดก็ได้เพื่อรักษาสีนั้นไว้ สีอื่นจะสร้างโดยรอบโทนของสีที่ยึดไว้ (ในโหมดสุ่มจะยังคงสุ่มอยู่)
4. คลิกที่ Copy HEX บนสีใดสีหนึ่งเพื่อคัดลอกค่า HEX ของสีนั้นไปยังคลิปบอร์ด
5. ใช้ คัดลอกทั้งหมด เพื่อคัดลอกสีทั้ง 5 สีในคราวเดียว ในรูปแบบการส่งออกที่เลือกไว้ข้างๆ สำหรับใช้ในเครื่องมือออกแบบหรือโค้ด
6. คลิกที่ 'จากภาพ' และเลือกภาพ — เครื่องมือจะดึงสีหลัก 5 สีจากภาพนั้นเข้ามาในพาเลท โดยประมวลผลทั้งหมดในเครื่อง
7. เลือกรูปแบบการส่งออก — รายการ HEX, ตัวแปร CSS, Tailwind, JSON, หรือโทเคน Figma — จากนั้นคลิกที่ คัดลอกทั้งหมด เพื่อใส่พาเลทเข้าโปรเจกต์
8. หรือพิมพ์คำอธิบายอารมณ์ เช่น พระอาทิตย์ตก มหาสมุทร หรือไซเบอร์พังก์ และคลิกที่ จากอารมณ์ เพื่อสร้างพาเลทในสไตล์นั้น

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

เครื่องมือนี้ใช้ฟรีไหม?

ใช่ ใช้ฟรีทั้งหมด — ไม่มีการสมัครสมาชิก ไม่มีการสร้างบัญชี และไม่มีข้อจำกัดแฝง แค่เปิดหน้าเว็บและเริ่มสร้างโทนสีได้ทันที

คุณอัปโหลดข้อมูลสีของฉันไปยังเซิร์ฟเวอร์ไหม?

ไม่ ทั้งหมดทำงานในเบราว์เซอร์ของคุณโดยใช้ JavaScript ไม่มีข้อมูลใดถูกส่งไปยังเซิร์ฟเวอร์ — ข้อมูลโทนสีของคุณจะอยู่ใน localStorage ของเบราว์เซอร์ของคุณเท่านั้น

เครื่องมือสร้างโทนสีทำงานได้เมื่อไม่มีการเชื่อมต่ออินเทอร์เน็ตไหม?

ใช่ เมื่อหน้าเว็บโหลดเสร็จแล้ว เครื่องมือนี้จะทำงานได้ทั้งหมดโดยไม่ต้องเชื่อมต่ออินเทอร์เน็ต ไม่มีการเรียกใช้ API ภายนอกหรือขึ้นอยู่กับ CDN

ความแตกต่างระหว่างโหมดความกลมกลืนคืออะไร?

สุ่ม เลือกสี 5 โทนที่ไม่เกี่ยวข้องกัน สีที่คล้ายกัน กระจายสี 5 โทนที่ห่างกัน 20° บนพื้นที่ 80° ของวงล้อสีเพื่อให้ดูสงบและกลมกลืนกัน สีตรงข้าม วางสี 2 สีใกล้โทนหลัก และ 3 สีอีกฝั่งตรงข้ามของวงล้อ (ห่างจากโทนหลัก 170°, 180° และ 190°) เพื่อให้มีความตัดกันสูง สีสามสี วางสีห่างกัน 120°: สี 2 สีใกล้โทนหลัก สี 2 สีใกล้ +120° และสี 1 สีที่ +240° ความอิ่มตัวและความสว่างจะเปลี่ยนแปลงในช่วงปานกลางในทุกโหมด วงล้อเป็นวงล้อสี HSL (สีหน้าจอสว่าง) ดังนั้นสีตรงข้ามกับสีแดงคือสีฟ้าเทอร์ควอยซ์ ไม่ใช่สีเขียว

ฉันสามารถเก็บสีที่ชอบไว้ขณะสร้างโทนสีใหม่ได้ไหม?

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

ฉันสามารถสร้างพาเลทสีจากภาพได้ไหม?

ใช่ คลิกที่'จากภาพ'และเลือกภาพ เครื่องมือจะย่อขนาดภาพ จัดกลุ่มพิกเซลที่คล้ายกันด้วยเทคนิค median-cut quantization และเลือกกลุ่มสีที่โดดเด่นที่สุด 5 กลุ่มที่ดูแตกต่างกันชัดเจน ผลลัพธ์แต่ละสีเป็นสีที่ปรากฏจริงในภาพ ไม่ใช่ค่าเฉลี่ย จัดเรียงจากสีเข้มไปสีอ่อน ทุกอย่างเกิดขึ้นในเบราว์เซอร์ — ไม่มีการอัปโหลดภาพ หากภาพมีสีแตกต่างกันน้อยกว่า 5 สี เช่นสีเดียวเรียบ สีที่เหลือเป็นระดับอ่อนและเข้มของสีหลัก

มีรูปแบบการส่งออกอะไรบ้าง?

คัดลอกพาเลทเป็นรายการ HEX ธรรมดา คุณสมบัติกำหนดเอง CSS (:root variables) ชิ้นส่วนสี Tailwind อาร์เรย์ JSON หรือโทเคนออกแบบ Figma (รูปแบบ Tokens Studio) เลือกรูปแบบในเมนูดรอปดาวน์แล้วคลิกคัดลอกทั้งหมด — พร้อมวางในโค้ดหรือเครื่องมือออกแบบ

ฉันสามารถดูหมายเลข Pantone สำหรับพาเลตได้ไหม?

ใช่ ส่วนทั้งห้าส่วนแสดงรหัส HEX และ PANTONE Solid Coated ที่ใกล้เคียงที่สุด (เช่น PANTONE 185 C) คลิกที่ป้ายชื่อ Pantone เพื่อคัดลอก ความตรงกันนี้ใช้สูตร CIEDE2000 แบบรับรู้ และเป็นเพียงการอ้างอิง sRGB ประมาณ เนื่องจากหมึก Pantone แบบ spot ถูกกำหนดทางกายภาพ ไม่ใช่ค่าบนหน้าจอ

สร้างพาเลทจากคำได้ไหม

ใช่ พิมพ์อารมณ์ เช่น พระอาทิตย์ตก มหาสมุทร ไซเบอร์พังค์ หรือโอบังซาเอค (สีดั้งเดิม 5 สีของเกาหลี) ในกล่องอารมณ์และคลิกที่จากอารมณ์ คำอารมณ์ที่รู้จักจะใช้ช่วงโทนสี ความอิ่มตัว และความสว่างที่ตรงกัน และโอบังซาเอคจะคืนค่า 5 สีดั้งเดิมที่กำหนดไว้ คำที่เครื่องมือไม่รู้จักยังสร้างพาเลทได้ แต่สีไม่เกี่ยวข้องกับความหมายของคำ

เครื่องมือนี้จะอัปโหลดข้อมูลของฉันหรือไม่?

ไม่ ทุกอย่างทำงานในเบราว์เซอร์ของคุณ ดังนั้นข้อมูลของคุณจึงไม่เคยออกจากอุปกรณ์ของคุณ — และหลังจากโหลดหน้าแล้วยังใช้งานแบบออฟไลน์ได้ด้วย

รัน 32 ครั้งใน 29 วันที่ผ่านมา ผลลัพธ์คัดลอกหรือดาวน์โหลดแล้ว: 12% วัดจากเซิร์ฟเวอร์ของเราเอง 2026-10-11–2026-11-09