โค้ดสี · Earth tone · 24 เฉด
สีเอิร์ธโทน โค้ดสีเอิร์ธโทนทุกเฉด HEX RGB CMYK
โค้ดสีเอิร์ธโทนที่หน้านี้ใช้เป็นสีตัวแทนคือดินเผา #C66B3D หรือ RGB 198, 107, 61 และหน้านี้รวมสีเอิร์ธโทนไว้ 24 เฉด พร้อมโค้ด HEX RGB CMYK HSL ให้แตะคัดลอกได้ทันที
- HEX
-
#C66B3D - RGB
-
198, 107, 61 - CMYK
-
0, 46, 69, 22 - HSL
-
20°, 55%, 51%
เอิร์ธโทนคือกลุ่มสีที่เห็นในธรรมชาติ ทั้งดิน หิน ทราย ไม้ และใบไม้แห้ง หน้านี้รวมเอิร์ธโทนจากหลายตระกูลสีไว้ในที่เดียว พร้อมพาเล็ตต์ที่จับคู่ไว้ให้แล้ว
ตรวจสอบข้อมูลเมื่อ November 2026
โค้ดสีเอิร์ธโทนทั้ง 24 เฉด
ด้านล่างคือสีเอิร์ธโทนทั้ง 24 เฉด เรียงจากอ่อนไปเข้ม แต่ละเฉดมีค่า HEX, RGB, CMYK และ HSL ให้แตะคัดลอกได้ทีละค่า เฉดที่มีป้าย "มาตรฐาน CSS" (8 เฉด) ใช้ค่าตามตารางชื่อสีมาตรฐานของ W3C พิมพ์ชื่อสีนั้นในโค้ด CSS ได้ตรง ๆ ส่วนเฉดที่มีป้าย "ค่าที่นิยมใช้" (16 เฉด) เป็นค่าที่ ThaiGraph เลือกให้ตรงกับชื่อเรียกที่คนไทยใช้ ไม่ใช่ค่ามาตรฐาน และแต่ละคนอาจเรียกสีเดียวกันต่างกันได้เล็กน้อย ความต่างของเฉดอ่อน เฉดเข้ม และโทนหม่น อธิบายไว้ที่ เฉดสีและโทนสี
- #EDE3D1
ครีม
ลินิน Linen cream
ค่าที่นิยมใช้
- HEX
-
#EDE3D1 - RGB
-
237, 227, 209 - CMYK
-
0, 4, 12, 7 - HSL
-
39°, 44%, 87%
- #D8C3A5
เบจ
ดิน Earth beige
ค่าที่นิยมใช้
- HEX
-
#D8C3A5 - RGB
-
216, 195, 165 - CMYK
-
0, 10, 24, 15 - HSL
-
35°, 40%, 75%
- #DEB887
น้ำตาล
ไม้ เบิร์ล Burlywood
มาตรฐาน CSS
burlywood- HEX
-
#DEB887 - RGB
-
222, 184, 135 - CMYK
-
0, 17, 39, 13 - HSL
-
34°, 57%, 70%
- #D2B48C
น้ำตาล
แทน Tan
มาตรฐาน CSS
tan- HEX
-
#D2B48C - RGB
-
210, 180, 140 - CMYK
-
0, 14, 33, 18 - HSL
-
34°, 44%, 69%
- #BC8F8F
น้ำตาล
อม ชมพู Rosy brown
มาตรฐาน CSS
rosybrown- HEX
-
#BC8F8F - RGB
-
188, 143, 143 - CMYK
-
0, 24, 24, 26 - HSL
-
0°, 25%, 65%
- #C2B280
ทราย
Sand
ค่าที่นิยมใช้
- HEX
-
#C2B280 - RGB
-
194, 178, 128 - CMYK
-
0, 8, 34, 24 - HSL
-
45°, 35%, 63%
- #9CAF88
เขียว
เซจ Sage
ค่าที่นิยมใช้
- HEX
-
#9CAF88 - RGB
-
156, 175, 136 - CMYK
-
11, 0, 22, 31 - HSL
-
89°, 20%, 61%
- #CD853F
น้ำตาล
เปรู Peru
มาตรฐาน CSS
peru- HEX
-
#CD853F - RGB
-
205, 133, 63 - CMYK
-
0, 35, 69, 20 - HSL
-
30°, 59%, 53%
- #B66A50
ดิน
เหนียว Clay
ค่าที่นิยมใช้
- HEX
-
#B66A50 - RGB
-
182, 106, 80 - CMYK
-
0, 42, 56, 29 - HSL
-
15°, 41%, 51%
- #C66B3D
ดิน
เผา Terracotta
ค่าที่นิยมใช้
- HEX
-
#C66B3D - RGB
-
198, 107, 61 - CMYK
-
0, 46, 69, 22 - HSL
-
20°, 55%, 51%
- #8B8478
เทา
หิน Stone gray
ค่าที่นิยมใช้
- HEX
-
#8B8478 - RGB
-
139, 132, 120 - CMYK
-
0, 5, 14, 45 - HSL
-
38°, 8%, 51%
- #8A9A5B
เขียว
มอส Moss
ค่าที่นิยมใช้
- HEX
-
#8A9A5B - RGB
-
138, 154, 91 - CMYK
-
10, 0, 41, 40 - HSL
-
75°, 26%, 48%
- #CC7722
เหลือง
โอเคอร์ Ochre
ค่าที่นิยมใช้
- HEX
-
#CC7722 - RGB
-
204, 119, 34 - CMYK
-
0, 42, 83, 20 - HSL
-
30°, 71%, 47%
- #C9A227
เหลือง
มัสตาร์ด หม่น Muted mustard
ค่าที่นิยมใช้
- HEX
-
#C9A227 - RGB
-
201, 162, 39 - CMYK
-
0, 19, 81, 21 - HSL
-
46°, 68%, 47%
- #C0502B
ส้ม
อิฐ Brick orange
ค่าที่นิยมใช้
- HEX
-
#C0502B - RGB
-
192, 80, 43 - CMYK
-
0, 58, 78, 25 - HSL
-
15°, 63%, 46%
- #A0522D
น้ำตาล
เซียนนา Sienna
มาตรฐาน CSS
sienna- HEX
-
#A0522D - RGB
-
160, 82, 45 - CMYK
-
0, 49, 72, 37 - HSL
-
19°, 56%, 40%
- #B7410E
สนิม
Rust
ค่าที่นิยมใช้
- HEX
-
#B7410E - RGB
-
183, 65, 14 - CMYK
-
0, 64, 92, 28 - HSL
-
18°, 86%, 39%
- #8B5A2B
น้ำตาล
ดิน Earth brown
ค่าที่นิยมใช้
- HEX
-
#8B5A2B - RGB
-
139, 90, 43 - CMYK
-
0, 35, 69, 45 - HSL
-
29°, 53%, 36%
- #7B5B3A
น้ำตาล
ไม้ Wood brown
ค่าที่นิยมใช้
- HEX
-
#7B5B3A - RGB
-
123, 91, 58 - CMYK
-
0, 26, 53, 52 - HSL
-
30°, 36%, 35%
- #8B4513
น้ำตาล
อานม้า Saddle brown
มาตรฐาน CSS
saddlebrown- HEX
-
#8B4513 - RGB
-
139, 69, 19 - CMYK
-
0, 50, 86, 45 - HSL
-
25°, 76%, 31%
- #6E4A2E
น้ำตาล
ไหม้ Burnt umber
ค่าที่นิยมใช้
- HEX
-
#6E4A2E - RGB
-
110, 74, 46 - CMYK
-
0, 33, 58, 57 - HSL
-
26°, 41%, 31%
- #556B2F
เขียว
มะกอก เข้ม Dark olive green
มาตรฐาน CSS
darkolivegreen- HEX
-
#556B2F - RGB
-
85, 107, 47 - CMYK
-
21, 0, 56, 58 - HSL
-
82°, 39%, 30%
- #808000
เขียว
มะกอก Olive
มาตรฐาน CSS
olive- HEX
-
#808000 - RGB
-
128, 128, 0 - CMYK
-
0, 0, 100, 50 - HSL
-
60°, 100%, 25%
- #4B5320
เขียว
ขี้ม้า Army green
ค่าที่นิยมใช้
- HEX
-
#4B5320 - RGB
-
75, 83, 32 - CMYK
-
10, 0, 61, 67 - HSL
-
69°, 44%, 23%
ค่า CMYK ในหน้านี้คำนวณจากค่าสีบนจอด้วยสูตรแปลงพื้นฐาน ใช้เป็นจุดตั้งต้นได้ดี แต่สีที่พิมพ์ออกมาจริงขึ้นกับกระดาษ หมึก และโปรไฟล์สีของโรงพิมพ์ งานที่สีต้องตรงควรขอปรู๊ฟก่อนเสมอ ความต่างของ RGB กับ CMYK อ่านต่อได้ที่ CMYK กับ RGB ต่างกันอย่างไร
พาเล็ตต์สีเอิร์ธโทนพร้อมใช้
พาเล็ตต์ 4 ชุดนี้จับคู่สีเอิร์ธโทนกับสีพื้น สีตัวหนังสือ และสีเน้นไว้ให้แล้ว แตะสีใดก็ได้เพื่อคัดลอกโค้ดทีละสี หรือกด "คัดลอกทั้งชุด" เพื่อเอาไปวางทีเดียวครบ 5 สี ลำดับสีในแต่ละชุดไม่ได้บังคับ ลองสลับว่าสีไหนเป็นพื้นหลังและสีไหนเป็นตัวหนังสือ แล้วตรวจความอ่านง่ายด้วยตารางค่าคอนทราสต์ด้านล่าง หรือแปลงค่าเป็นรูปแบบอื่นด้วย เครื่องมือแปลงโค้ดสี
-
ดินเผากับเซจ
#C66B3D#9CAF88#EDE3D1#6E4A2E#F7F2EA -
ทะเลทราย
#C2B280#D8C3A5#CC7722#8B5A2B#3A2E22 -
ป่าฤดูใบไม้ร่วง
#B7410E#C9A227#556B2F#8A9A5B#2E2A20 -
บ้านดิน
#B66A50#DEB887#8B8478#EDE3D1#4B5320
สีเอิร์ธโทนเข้ากับสีอะไร
สีเอิร์ธโทนรวมหลายโทนสีไว้ด้วยกัน จึงจับคู่ได้ทั้งภายในกลุ่มเดียวกัน และกับสีตรงข้ามของแต่ละสี ด้านล่างคือสีตรงข้ามของสีเอิร์ธโทน 2 สีที่เด่นที่สุดในกลุ่ม คำนวณด้วยการหมุนค่าเฉดสี (Hue) 180 องศาในระบบ HSL โดยคงความสดและความสว่างไว้ สีคู่ที่ได้จึงยังอ่อนหรือหม่นในระดับเดียวกัน และเข้ากับพาเล็ตต์เดิมได้ทันที หลักการเพิ่มเติมอยู่ที่ สีคู่ตรงข้าม
-
เขียว
มะกอก คู่ตรงข้าม · 180°#808000เขียว
มะกอก สีตั้งต้น#000080น้ำเงิน
กรมท่า +180° -
สนิม คู่ตรงข้าม · 180°
#B7410Eสนิม สีตั้งต้น
#0E84B7ใกล้ ฟ้า
น้ำ +180°ทะเล
ตัวหนังสือบนสีเอิร์ธโทนควรเป็นสีอะไร
บนดินเผา #C66B3D ตัวหนังสือสีดำอ่านง่ายกว่า ได้ค่าคอนทราสต์ 5.57:1 ส่วนตัวหนังสือสีขาวได้ 3.76:1 เกณฑ์ขั้นต่ำของ WCAG 2.2 (ระดับ AA) คือคอนทราสต์ระหว่างตัวหนังสือกับพื้นหลังอย่างน้อย 4.5:1 สำหรับตัวหนังสือขนาดปกติ และ 3:1 สำหรับตัวหนังสือขนาดใหญ่ (อย่างน้อย 18pt หรือ 14pt ตัวหนา) ตารางด้านล่างคำนวณค่านี้ให้สีเอิร์ธโทนอีกหลายเฉด เพื่อเลือกสีตัวหนังสือได้ถูกตั้งแต่แรก
| เฉด | ตัวหนังสือขาว | ตัวหนังสือดำ |
|---|---|---|
| ครีม | 1.27:1 ไม่ผ่าน | 16.50:1 ผ่าน · แนะนำ |
| น้ำตาล | 1.97:1 ไม่ผ่าน | 10.64:1 ผ่าน · แนะนำ |
| เขียว | 2.35:1 ไม่ผ่าน | 8.90:1 ผ่าน · แนะนำ |
| ดิน | 3.76:1 ผ่านเฉพาะตัวใหญ่ | 5.57:1 ผ่าน · แนะนำ |
| เหลือง | 3.37:1 ผ่านเฉพาะตัวใหญ่ | 6.22:1 ผ่าน · แนะนำ |
| น้ำตาล | 5.61:1 ผ่าน · แนะนำ | 3.73:1 ผ่านเฉพาะตัวใหญ่ |
| น้ำตาล | 6.17:1 ผ่าน · แนะนำ | 3.39:1 ผ่านเฉพาะตัวใหญ่ |
| เขียว | 5.94:1 ผ่าน · แนะนำ | 3.53:1 ผ่านเฉพาะตัวใหญ่ |
สีเอิร์ธโทนให้ความรู้สึกแบบไหน
เอิร์ธโทนคือกลุ่มสีที่ได้แรงบันดาลใจจากสีในธรรมชาติ เช่น ดิน ทราย ไม้ หิน และใบไม้
เอิร์ธโทนให้ความรู้สึกอบอุ่น สงบ และใกล้ชิดธรรมชาติ จึงเป็นพาเล็ตต์ยอดนิยมของคาเฟ่ ร้านต้นไม้ แบรนด์ออร์แกนิก งานตกแต่งบ้าน และงานแต่งงานแนวรัสติก ทุกสีในกลุ่มนี้มีความสดต่ำ จึงจับคู่กันได้ง่ายและดูกลมกลืน
จุดที่ทำให้งานเอิร์ธโทนดูดีคือความต่างของน้ำหนักสี ควรมีทั้งสีอ่อนอย่างทรายหรือครีม สีกลางอย่างดินเผา และสีเข้มอย่างน้ำตาลไหม้หรือเขียวมะกอกเข้มอยู่ในงานเดียวกัน
ความหมายของสีในวัฒนธรรมไทย เช่น สีกับงานมงคลและงานพิธี อ่านต่อได้ที่ จิตวิทยาสีไทย
เคล็ดลับใช้สีเอิร์ธโทนในงานออกแบบ
หลักง่าย ๆ คือให้สีเอิร์ธโทนมีบทบาทเดียวในงาน จะเป็นสีหลัก สีพื้น หรือสีเน้นก็ได้ แล้วเลือกสีอื่นมารับบทที่เหลือให้ชัดเจน เคล็ดลับด้านล่างใช้ได้ทั้งงานพิมพ์และงานบนจอ
- ใช้สีอ่อนเป็นพื้นหลัง สีกลางเป็นสีหลัก และสีเข้มเป็นตัวหนังสือ
- เขียวเซจหรือเขียวมะกอกช่วยให้พาเล็ตต์ส้มและน้ำตาลไม่ร้อนเกินไป
- ถ้าต้องการจุดเด่น ให้เติมสีสดหนึ่งสีที่ยังอยู่ในโทนอุ่น เช่น ส้มไหม้หรือเหลืองมัสตาร์ด
- เอิร์ธโทนพิมพ์บนกระดาษถนอมสายตาหรือกระดาษคราฟต์ได้สวย เพราะเนื้อกระดาษช่วยเสริมความเป็นธรรมชาติ
วิธีนำโค้ดสีเอิร์ธโทนไปใช้
แตะค่า HEX ในตารางเพื่อคัดลอก แล้ววางในช่องรหัสสีของโปรแกรมได้ทันที ใช้ได้ทั้ง Canva, Figma, Photoshop และ Illustrator ส่วน Microsoft Word ให้ไปที่ More Colors แล้ววางค่า HEX ในช่อง Hex ของแท็บ Custom (Word รุ่นเก่าที่ไม่มีช่องนี้ให้ใส่ค่า RGB แทน) ขั้นตอนของแต่ละโปรแกรมอยู่ที่ หน้ารวมโค้ดสี ถ้ามีโค้ดสีในรูปแบบอื่นอยู่แล้ว เช่น CMYK จากโรงพิมพ์ แปลงกลับเป็น HEX ได้ที่ เครื่องมือแปลงโค้ดสี
โค้ดสีตระกูลอื่น
ThaiGraph รวมโค้ดสีไว้ 19 ตระกูล รวม 450 เฉด เลือกตระกูลที่ต้องการด้านล่าง หรือดูทุกเฉดในหน้าเดียวพร้อมช่องค้นหาที่ รวมโค้ดสี ส่วนสีไทยโบราณอยู่ที่ สีไทย Thaitone
ตรวจสอบข้อมูลเมื่อ November 2026
แหล่งอ้างอิง
- ค่า HEX ของเฉดที่มีป้าย "มาตรฐาน CSS" ทั้ง 8 เฉด (เช่น sienna = #A0522D) ตามตารางชื่อสีมาตรฐาน—W3C, CSS Color Module Level 4 — §6.1 Named Colors (accessed Nov 3, 2026)
- โค้ด HEX 6 หลักคือค่าแดง เขียว และน้ำเงิน คู่ละ 2 หลัก ในระบบเลขฐานสิบหก—W3C, CSS Color Module Level 4 — §5.2 The RGB Hexadecimal Notations (accessed Nov 3, 2026)
- เกณฑ์คอนทราสต์ขั้นต่ำ 4.5:1 สำหรับตัวหนังสือขนาดปกติ และ 3:1 สำหรับตัวหนังสือขนาดใหญ่ (อย่างน้อย 18pt หรือ 14pt ตัวหนา)—W3C, Understanding WCAG 2.2 — Success Criterion 1.4.3 Contrast (Minimum) (accessed Nov 3, 2026)