AbraCalc

ตัวสร้างเฉดสี

สร้างชุดสี 5 โทนอ่อนกว่าและ 5 โทนเข้มกว่าจากสี hex ใดก็ได้

ฝังเครื่องมือนี้ในเว็บไซต์ของคุณ
อ้างอิงเครื่องมือนี้

APA

AbraCalc. (2026). ตัวสร้างเฉดสี [Online calculator]. Retrieved from https://abracalc.com/th/khamnuan-chedsi/

BibTeX

@misc{abracalc-khamnuan-chedsi, author = {AbraCalc}, title = {ตัวสร้างเฉดสี}, year = {2026}, howpublished = {\url{https://abracalc.com/th/khamnuan-chedsi/}} }

เครื่องมือนี้ตอบคำถามของคุณหรือไม่

วิธีใช้เครื่องมือนี้

  1. กรอกสี hex ตั้งต้นของคุณ
  2. เลือกจำนวนขั้น (1–10) ในแต่ละทิศทาง
  3. ผลลัพธ์แสดงโทนอ่อน (lighter) สีตั้งต้น แล้วตามด้วยโทนเข้ม (darker)

กรอกสี hex เพื่อสร้างชุดสีครบชุดทั้งโทนอ่อนและโทนเข้ม เหมาะสำหรับสร้างระบบดีไซน์

สูตร

For each tint step i (1 to steps), mixing factor t = i / (steps + 1):
Rtint = R + (255 − R) × t (similarly for G, B)

For each shade step j (1 to steps), darkening factor s = j / (steps + 1):
Rshade = R × (1 − s) (similarly for G, B)

All channel values are clamped to 0–255 and rounded.

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

โทนอ่อน (tint) กับโทนเข้ม (shade) ต่างกันอย่างไร?
โทนอ่อนคือสีที่ผสมกับสีขาว (สว่างขึ้น) ส่วนโทนเข้มคือสีที่ผสมกับสีดำ (เข้มขึ้น) ส่วนโทน (tone) คือการผสมกับสีเทา
แต่ละขั้นคำนวณอย่างไร?
แต่ละขั้นจะประมาณค่าเชิงเส้นของช่องสัญญาณ RGB เข้าหาสีขาว (สำหรับโทนอ่อน) หรือสีดำ (สำหรับโทนเข้ม) ด้วยสัดส่วนที่เท่ากัน

แหล่งอ้างอิง