โค้ดสี · Cream · 20 เฉด
สีครีม โค้ดสีครีมทุกเฉด รหัสสี HEX RGB CMYK
โค้ดสีครีมที่หน้านี้ใช้เป็นสีตัวแทนคือครีม #FFFDD0 หรือ RGB 255, 253, 208 และหน้านี้รวมสีครีมไว้ 20 เฉด พร้อมโค้ด HEX RGB CMYK HSL ให้แตะคัดลอกได้ทันที
- HEX
-
#FFFDD0 - RGB
-
255, 253, 208 - CMYK
-
0, 1, 18, 0 - HSL
-
57°, 100%, 91%
ครีมคือขาวที่อมเหลืองขึ้นมาอีกนิด เป็นสีพื้นหลังที่อบอุ่นกว่าขาวสนิท หน้านี้รวมครีมทั้งโทนเหลือง โทนชมพู และโทนน้ำตาลอ่อน
ตรวจสอบข้อมูลเมื่อ November 2026
โค้ดสีครีมทั้ง 20 เฉด
ด้านล่างคือสีครีมทั้ง 20 เฉด เรียงจากอ่อนไปเข้ม แต่ละเฉดมีค่า HEX, RGB, CMYK และ HSL ให้แตะคัดลอกได้ทีละค่า เฉดที่มีป้าย "มาตรฐาน CSS" (2 เฉด) ใช้ค่าตามตารางชื่อสีมาตรฐานของ W3C พิมพ์ชื่อสีนั้นในโค้ด CSS ได้ตรง ๆ ส่วนเฉดที่มีป้าย "ค่าที่นิยมใช้" (18 เฉด) เป็นค่าที่ ThaiGraph เลือกให้ตรงกับชื่อเรียกที่คนไทยใช้ ไม่ใช่ค่ามาตรฐาน และแต่ละคนอาจเรียกสีเดียวกันต่างกันได้เล็กน้อย ความต่างของเฉดอ่อน เฉดเข้ม และโทนหม่น อธิบายไว้ที่ เฉดสีและโทนสี
- #FFF8E7
ครีม
นม Milk cream
ค่าที่นิยมใช้
- HEX
-
#FFF8E7 - RGB
-
255, 248, 231 - CMYK
-
0, 3, 9, 0 - HSL
-
43°, 100%, 95%
- #F9F1E7
ครีม
มะพร้าว Coconut cream
ค่าที่นิยมใช้
- HEX
-
#F9F1E7 - RGB
-
249, 241, 231 - CMYK
-
0, 3, 7, 2 - HSL
-
33°, 60%, 94%
- #FFF8DC
ครีม
คอร์นซิลค์ Cornsilk
มาตรฐาน CSS
cornsilk- HEX
-
#FFF8DC - RGB
-
255, 248, 220 - CMYK
-
0, 3, 14, 0 - HSL
-
48°, 100%, 93%
- #F8F1DC
ครีม
นวล Soft cream
ค่าที่นิยมใช้
- HEX
-
#F8F1DC - RGB
-
248, 241, 220 - CMYK
-
0, 3, 11, 3 - HSL
-
45°, 67%, 92%
- #F7E1D7
ครีม
อม ชมพู Pink cream
ค่าที่นิยมใช้
- HEX
-
#F7E1D7 - RGB
-
247, 225, 215 - CMYK
-
0, 9, 13, 3 - HSL
-
19°, 67%, 91%
- #FFFDD0
ครีม
Cream
ค่าที่นิยมใช้
- HEX
-
#FFFDD0 - RGB
-
255, 253, 208 - CMYK
-
0, 1, 18, 0 - HSL
-
57°, 100%, 91%
- #FCE5CD
ครีม
พีช Peach cream
ค่าที่นิยมใช้
- HEX
-
#FCE5CD - RGB
-
252, 229, 205 - CMYK
-
0, 9, 19, 1 - HSL
-
31°, 89%, 90%
- #FFEBCD
ครีม
อัลมอนด์ Blanched almond
มาตรฐาน CSS
blanchedalmond- HEX
-
#FFEBCD - RGB
-
255, 235, 205 - CMYK
-
0, 8, 20, 0 - HSL
-
36°, 100%, 90%
- #F5EBD7
ครีม
ผ้าไหม Silk cream
ค่าที่นิยมใช้
- HEX
-
#F5EBD7 - RGB
-
245, 235, 215 - CMYK
-
0, 4, 12, 4 - HSL
-
40°, 60%, 90%
- #FBE3C9
ครีม
แอปริคอต Apricot cream
ค่าที่นิยมใช้
- HEX
-
#FBE3C9 - RGB
-
251, 227, 201 - CMYK
-
0, 10, 20, 2 - HSL
-
31°, 86%, 89%
- #F0EAD6
ครีม
เปลือกไข่ Eggshell
ค่าที่นิยมใช้
- HEX
-
#F0EAD6 - RGB
-
240, 234, 214 - CMYK
-
0, 3, 11, 6 - HSL
-
46°, 46%, 89%
- #F1E4CC
ครีม
ทราย Sand cream
ค่าที่นิยมใช้
- HEX
-
#F1E4CC - RGB
-
241, 228, 204 - CMYK
-
0, 5, 15, 5 - HSL
-
39°, 57%, 87%
- #E8E2D6
ครีม
เทา Greige cream
ค่าที่นิยมใช้
- HEX
-
#E8E2D6 - RGB
-
232, 226, 214 - CMYK
-
0, 3, 8, 9 - HSL
-
40°, 28%, 87%
- #FFF3B0
ครีม
อม เหลือง Yellow cream
ค่าที่นิยมใช้
- HEX
-
#FFF3B0 - RGB
-
255, 243, 176 - CMYK
-
0, 5, 31, 0 - HSL
-
51°, 100%, 85%
- #E3DAC9
ครีม
กระดูก Bone
ค่าที่นิยมใช้
- HEX
-
#E3DAC9 - RGB
-
227, 218, 201 - CMYK
-
0, 4, 11, 11 - HSL
-
39°, 32%, 84%
- #F9E7B5
ครีม
เนย Butter cream
ค่าที่นิยมใช้
- HEX
-
#F9E7B5 - RGB
-
249, 231, 181 - CMYK
-
0, 7, 27, 2 - HSL
-
44°, 85%, 84%
- #E8D3B9
ครีม
กาแฟ Café crème
ค่าที่นิยมใช้
- HEX
-
#E8D3B9 - RGB
-
232, 211, 185 - CMYK
-
0, 9, 20, 9 - HSL
-
33°, 51%, 82%
- #EAD9B5
ครีม
เข้ม Deep cream
ค่าที่นิยมใช้
- HEX
-
#EAD9B5 - RGB
-
234, 217, 181 - CMYK
-
0, 7, 23, 8 - HSL
-
41°, 56%, 81%
- #F3E5AB
ครีม
วานิลลา Vanilla
ค่าที่นิยมใช้
- HEX
-
#F3E5AB - RGB
-
243, 229, 171 - CMYK
-
0, 6, 30, 5 - HSL
-
48°, 75%, 81%
- #F6E3A1
ครีม
คัสตาร์ด Custard
ค่าที่นิยมใช้
- HEX
-
#F6E3A1 - RGB
-
246, 227, 161 - CMYK
-
0, 8, 35, 4 - HSL
-
47°, 83%, 80%
ค่า CMYK ในหน้านี้คำนวณจากค่าสีบนจอด้วยสูตรแปลงพื้นฐาน ใช้เป็นจุดตั้งต้นได้ดี แต่สีที่พิมพ์ออกมาจริงขึ้นกับกระดาษ หมึก และโปรไฟล์สีของโรงพิมพ์ งานที่สีต้องตรงควรขอปรู๊ฟก่อนเสมอ ความต่างของ RGB กับ CMYK อ่านต่อได้ที่ CMYK กับ RGB ต่างกันอย่างไร
พาเล็ตต์สีครีมพร้อมใช้
พาเล็ตต์ 4 ชุดนี้จับคู่สีครีมกับสีพื้น สีตัวหนังสือ และสีเน้นไว้ให้แล้ว แตะสีใดก็ได้เพื่อคัดลอกโค้ดทีละสี หรือกด "คัดลอกทั้งชุด" เพื่อเอาไปวางทีเดียวครบ 5 สี ลำดับสีในแต่ละชุดไม่ได้บังคับ ลองสลับว่าสีไหนเป็นพื้นหลังและสีไหนเป็นตัวหนังสือ แล้วตรวจความอ่านง่ายด้วยตารางค่าคอนทราสต์ด้านล่าง หรือแปลงค่าเป็นรูปแบบอื่นด้วย เครื่องมือแปลงโค้ดสี
-
คาเฟ่มินิมอล
#F8F1DC#E8D3B9#9CAF88#6F4E37#2B2B2B -
ครีมกับกรมท่า
#F5EBD7#FFF8E7#1F2A44#C9A54C#7A1F1F -
งานแต่งอบอุ่น
#FFF8E7#F7E1D7#E8B4A8#D9B97A#5C4033 -
ครีมกับส้มอิฐ
#F1E4CC#FBE3C9#C0502B#556B2F#3F2A1E
สีครีมเข้ากับสีอะไร
สีที่ตัดกับครีมได้ชัดที่สุดคือสีตรงข้ามบนวงจรสี #D0D2FF (ใกล้เคียงลาเวนเดอร์พาสเทล) ส่วนสีที่กลมกลืนที่สุดคือสีข้างเคียง #FFE6D0 และ #EAFFD0 ทุกค่าด้านล่างคำนวณจากครีม #FFFDD0 ด้วยการหมุนค่าเฉดสี (Hue) ในระบบ HSL โดยคงความสด (Saturation) และความสว่าง (Lightness) ไว้เท่าเดิม ชื่อที่กำกับใต้สีคือเฉดในคลังที่ดูใกล้เคียงที่สุด ถ้าไม่มีเฉดไหนใกล้พอจะแสดงเพียงองศาที่หมุน หลักการของแต่ละแบบอ่านต่อได้ที่ สีคู่ตรงข้าม และ วงจรสี
-
คู่ตรงข้าม Complementary · +180°
ตัดกันแรงที่สุด ใช้สีหนึ่งเป็นสีหลักและให้อีกสีเป็นจุดเน้นเล็ก ๆ เช่น ปุ่มหรือหัวข้อ
#FFFDD0ครีม สีตั้งต้น
#D0D2FFใกล้ ลาเวนเดอร์
พาสเทล +180° -
สีข้างเคียง Analogous · -30° / +30°
กลมกลืนและสบายตา เหมาะกับพื้นหลัง ภาพประกอบ และงานที่ต้องการอารมณ์เดียวกันทั้งหน้า
-
สามเส้า Triadic · +120° / +240°
สดใสและสมดุล ควรให้สีหนึ่งเด่นที่สุด แล้วใช้อีกสองสีเป็นสีรองในพื้นที่เล็กกว่า
-
คู่ตรงข้ามแยก Split complementary · +150° / +210°
ตัดกันชัดแต่ไม่แรงเท่าคู่ตรงข้าม จับคู่ง่ายกว่าและพลาดยากกว่า
ตัวหนังสือบนสีครีมควรเป็นสีอะไร
บนครีม #FFFDD0 ตัวหนังสือสีดำอ่านง่ายกว่า ได้ค่าคอนทราสต์ 20.21:1 ส่วนตัวหนังสือสีขาวได้ 1.03:1 เกณฑ์ขั้นต่ำของ WCAG 2.2 (ระดับ AA) คือคอนทราสต์ระหว่างตัวหนังสือกับพื้นหลังอย่างน้อย 4.5:1 สำหรับตัวหนังสือขนาดปกติ และ 3:1 สำหรับตัวหนังสือขนาดใหญ่ (อย่างน้อย 18pt หรือ 14pt ตัวหนา) ตารางด้านล่างคำนวณค่านี้ให้สีครีมอีกหลายเฉด เพื่อเลือกสีตัวหนังสือได้ถูกตั้งแต่แรก
| เฉด | ตัวหนังสือขาว | ตัวหนังสือดำ |
|---|---|---|
| ครีม | 1.05:1 ไม่ผ่าน | 19.83:1 ผ่าน · แนะนำ |
| ครีม | 1.06:1 ไม่ผ่าน | 19.71:1 ผ่าน · แนะนำ |
| ครีม | 1.25:1 ไม่ผ่าน | 16.70:1 ผ่าน · แนะนำ |
| ครีม#FFFDD0 | 1.03:1 ไม่ผ่าน | 20.21:1 ผ่าน · แนะนำ |
| ครีม | 1.21:1 ไม่ผ่าน | 17.22:1 ผ่าน · แนะนำ |
| ครีม | 1.18:1 ไม่ผ่าน | 17.74:1 ผ่าน · แนะนำ |
| ครีม | 1.20:1 ไม่ผ่าน | 17.44:1 ผ่าน · แนะนำ |
| ครีม | 1.28:1 ไม่ผ่าน | 16.28:1 ผ่าน · แนะนำ |
| ครีม | 1.38:1 ไม่ผ่าน | 15.13: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" ทั้ง 2 เฉด (เช่น cornsilk = #FFF8DC) ตามตารางชื่อสีมาตรฐาน—W3C, CSS Color Module Level 4 — §6.1 Named Colors (accessed Nov 3, 2026)
- ความหมายของคำว่า "ครีม": "สีอย่างสีขาวออกเหลือง"—พจนานุกรมฉบับราชบัณฑิตยสถาน (ฉบับออนไลน์) สำนักงานราชบัณฑิตยสภา (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)