ข้ามไปยังเนื้อหา

โค้ดสี · Light blue · 28 เฉด

สีฟ้า โค้ดสีฟ้าทุกเฉด รหัสสี HEX RGB CMYK

โค้ดสีฟ้าที่หน้านี้ใช้เป็นสีตัวแทนคือฟ้าท้องฟ้า #87CEEB หรือ RGB 135, 206, 235 ซึ่งเป็นชื่อสีมาตรฐาน CSS skyblue และหน้านี้รวมสีฟ้าไว้ 28 เฉด พร้อมโค้ด HEX RGB CMYK HSL ให้แตะคัดลอกได้ทันที

ฟ้าท้องฟ้า Sky blue
HEX
#87CEEB
RGB
135, 206, 235
CMYK
43, 12, 0, 8
HSL
197°, 71%, 73%

สีฟ้าคือน้ำเงินในเฉดที่สว่างขึ้น ให้ความรู้สึกโล่ง สะอาด และเป็นมิตร หน้านี้รวมทั้งฟ้าอ่อนแบบพาสเทล ฟ้าสดแบบท้องฟ้ากลางวัน และฟ้าอมเขียวแบบน้ำทะเล

โค้ดสีฟ้าทั้ง 28 เฉด

ด้านล่างคือสีฟ้าทั้ง 28 เฉด เรียงจากอ่อนไปเข้ม แต่ละเฉดมีค่า HEX, RGB, CMYK และ HSL ให้แตะคัดลอกได้ทีละค่า เฉดที่มีป้าย "มาตรฐาน CSS" (15 เฉด) ใช้ค่าตามตารางชื่อสีมาตรฐานของ W3C พิมพ์ชื่อสีนั้นในโค้ด CSS ได้ตรง ๆ ส่วนเฉดที่มีป้าย "ค่าที่นิยมใช้" (13 เฉด) เป็นค่าที่ ThaiGraph เลือกให้ตรงกับชื่อเรียกที่คนไทยใช้ ไม่ใช่ค่ามาตรฐาน และแต่ละคนอาจเรียกสีเดียวกันต่างกันได้เล็กน้อย ความต่างของเฉดอ่อน เฉดเข้ม และโทนหม่น อธิบายไว้ที่ เฉดสีและโทนสี

  • #E0FFFF

    ฟ้าไซแอนอ่อน

    Light cyan

    มาตรฐาน CSSlightcyan

    HEX
    #E0FFFF
    RGB
    224, 255, 255
    CMYK
    12, 0, 0, 0
    HSL
    180°, 100%, 94%
  • #D6ECF3

    ฟ้าน้ำแข็ง

    Ice blue

    ค่าที่นิยมใช้

    HEX
    #D6ECF3
    RGB
    214, 236, 243
    CMYK
    12, 3, 0, 5
    HSL
    194°, 55%, 90%
  • #C9DDF0

    ฟ้าซีด

    Pale blue

    ค่าที่นิยมใช้

    HEX
    #C9DDF0
    RGB
    201, 221, 240
    CMYK
    16, 8, 0, 6
    HSL
    209°, 57%, 86%
  • #AFEEEE

    ฟ้าเทอร์ควอยซ์อ่อน

    Pale turquoise

    มาตรฐาน CSSpaleturquoise

    HEX
    #AFEEEE
    RGB
    175, 238, 238
    CMYK
    26, 0, 0, 7
    HSL
    180°, 65%, 81%
  • #B0E0E6

    ฟ้าแป้ง

    Powder blue

    มาตรฐาน CSSpowderblue

    HEX
    #B0E0E6
    RGB
    176, 224, 230
    CMYK
    23, 3, 0, 10
    HSL
    187°, 52%, 80%
  • #ADD8E6

    ฟ้าอ่อน

    Light blue

    มาตรฐาน CSSlightblue

    HEX
    #ADD8E6
    RGB
    173, 216, 230
    CMYK
    25, 6, 0, 10
    HSL
    195°, 53%, 79%
  • #B7C9D6

    ฟ้าหมอก

    Mist blue

    ค่าที่นิยมใช้

    HEX
    #B7C9D6
    RGB
    183, 201, 214
    CMYK
    14, 6, 0, 16
    HSL
    205°, 27%, 78%
  • #A7C7E7

    ฟ้าพาสเทล

    Pastel blue

    ค่าที่นิยมใช้

    HEX
    #A7C7E7
    RGB
    167, 199, 231
    CMYK
    28, 14, 0, 9
    HSL
    210°, 57%, 78%
  • #B0C4DE

    ฟ้าเหล็กอ่อน

    Light steel blue

    มาตรฐาน CSSlightsteelblue

    HEX
    #B0C4DE
    RGB
    176, 196, 222
    CMYK
    21, 12, 0, 13
    HSL
    214°, 41%, 78%
  • #7FFFD4

    ฟ้าอะความารีน

    Aquamarine

    มาตรฐาน CSSaquamarine

    HEX
    #7FFFD4
    RGB
    127, 255, 212
    CMYK
    50, 0, 17, 0
    HSL
    160°, 100%, 75%
  • #87CEFA

    ฟ้าท้องฟ้าอ่อน

    Light sky blue

    มาตรฐาน CSSlightskyblue

    HEX
    #87CEFA
    RGB
    135, 206, 250
    CMYK
    46, 18, 0, 2
    HSL
    203°, 92%, 75%
  • #89CFF0

    ฟ้าเบบี้บลู

    Baby blue

    ค่าที่นิยมใช้

    HEX
    #89CFF0
    RGB
    137, 207, 240
    CMYK
    43, 14, 0, 6
    HSL
    199°, 77%, 74%
  • #87CEEB

    ฟ้าท้องฟ้า

    Sky blue

    มาตรฐาน CSSskyblue

    HEX
    #87CEEB
    RGB
    135, 206, 235
    CMYK
    43, 12, 0, 8
    HSL
    197°, 71%, 73%
  • #8DA9C4

    ฟ้าหม่น

    Dusty sky

    ค่าที่นิยมใช้

    HEX
    #8DA9C4
    RGB
    141, 169, 196
    CMYK
    28, 14, 0, 23
    HSL
    209°, 32%, 66%
  • #67D3E0

    ฟ้าสระว่ายน้ำ

    Pool blue

    ค่าที่นิยมใช้

    HEX
    #67D3E0
    RGB
    103, 211, 224
    CMYK
    54, 6, 0, 12
    HSL
    186°, 66%, 64%
  • #40E0D0

    ฟ้าเทอร์ควอยซ์

    Turquoise

    มาตรฐาน CSSturquoise

    HEX
    #40E0D0
    RGB
    64, 224, 208
    CMYK
    71, 0, 7, 12
    HSL
    174°, 72%, 56%
  • #1E90FF

    ฟ้าด็อดเจอร์

    Dodger blue

    มาตรฐาน CSSdodgerblue

    HEX
    #1E90FF
    RGB
    30, 144, 255
    CMYK
    88, 44, 0, 0
    HSL
    210°, 100%, 56%
  • #48D1CC

    ฟ้าเทอร์ควอยซ์กลาง

    Medium turquoise

    มาตรฐาน CSSmediumturquoise

    HEX
    #48D1CC
    RGB
    72, 209, 204
    CMYK
    66, 0, 2, 18
    HSL
    178°, 60%, 55%
  • #48C9B0

    ฟ้าอมเขียว

    Blue green

    ค่าที่นิยมใช้

    HEX
    #48C9B0
    RGB
    72, 201, 176
    CMYK
    64, 0, 12, 21
    HSL
    168°, 54%, 54%
  • #00FFFF

    ฟ้าไซแอน

    Cyan / Aqua

    มาตรฐาน CSScyan

    HEX
    #00FFFF
    RGB
    0, 255, 255
    CMYK
    100, 0, 0, 0
    HSL
    180°, 100%, 50%
  • #5F9EA0

    ฟ้าอมเทาคาเด็ต

    Cadet blue

    มาตรฐาน CSScadetblue

    HEX
    #5F9EA0
    RGB
    95, 158, 160
    CMYK
    41, 1, 0, 37
    HSL
    182°, 25%, 50%
  • #00BFFF

    ฟ้าสดดีปสกาย

    Deep sky blue

    มาตรฐาน CSSdeepskyblue

    HEX
    #00BFFF
    RGB
    0, 191, 255
    CMYK
    100, 25, 0, 0
    HSL
    195°, 100%, 50%
  • #3B83BD

    ฟ้าคราม

    Cerulean blue

    ค่าที่นิยมใช้

    HEX
    #3B83BD
    RGB
    59, 131, 189
    CMYK
    69, 31, 0, 26
    HSL
    207°, 52%, 49%
  • #1AC1DD

    ฟ้าคาริบเบียน

    Caribbean blue

    ค่าที่นิยมใช้

    HEX
    #1AC1DD
    RGB
    26, 193, 221
    CMYK
    88, 13, 0, 13
    HSL
    189°, 79%, 48%
  • #00AEEF

    ฟ้าไซแอนงานพิมพ์

    Process cyan (screen)

    ค่าที่นิยมใช้

    HEX
    #00AEEF
    RGB
    0, 174, 239
    CMYK
    100, 27, 0, 6
    HSL
    196°, 100%, 47%
  • #2E8BC0

    ฟ้าน้ำทะเล

    Sea blue

    ค่าที่นิยมใช้

    HEX
    #2E8BC0
    RGB
    46, 139, 192
    CMYK
    76, 28, 0, 25
    HSL
    202°, 61%, 47%
  • #00CED1

    ฟ้าเทอร์ควอยซ์เข้ม

    Dark turquoise

    มาตรฐาน CSSdarkturquoise

    HEX
    #00CED1
    RGB
    0, 206, 209
    CMYK
    100, 1, 0, 18
    HSL
    181°, 100%, 41%
  • #007BA7

    ฟ้าเซรูเลียน

    Cerulean

    ค่าที่นิยมใช้

    HEX
    #007BA7
    RGB
    0, 123, 167
    CMYK
    100, 26, 0, 35
    HSL
    196°, 100%, 33%

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

พาเล็ตต์สีฟ้าพร้อมใช้

พาเล็ตต์ 4 ชุดนี้จับคู่สีฟ้ากับสีพื้น สีตัวหนังสือ และสีเน้นไว้ให้แล้ว แตะสีใดก็ได้เพื่อคัดลอกโค้ดทีละสี หรือกด "คัดลอกทั้งชุด" เพื่อเอาไปวางทีเดียวครบ 5 สี ลำดับสีในแต่ละชุดไม่ได้บังคับ ลองสลับว่าสีไหนเป็นพื้นหลังและสีไหนเป็นตัวหนังสือ แล้วตรวจความอ่านง่ายด้วยตารางค่าคอนทราสต์ด้านล่าง หรือแปลงค่าเป็นรูปแบบอื่นด้วย เครื่องมือแปลงโค้ดสี

  • ท้องฟ้าโปร่ง

    #007BA7
    #3B83BD
    #87CEEB
    #D6ECF3
    #FFFFFF
  • ชายหาด

    #1AC1DD
    #67D3E0
    #F5E6CA
    #FF8C69
    #1B2A4A
  • ฟ้าพาสเทล

    #A7C7E7
    #C9DDF0
    #F8C8DC
    #FFF5BA
    #5A6B7B
  • คลินิกสะอาดตา

    #2E8BC0
    #B0E0E6
    #F4F8FB
    #48C9B0
    #26314A

สีฟ้าเข้ากับสีอะไร

สีที่ตัดกับฟ้าท้องฟ้าได้ชัดที่สุดคือสีตรงข้ามบนวงจรสี #EBA487 (ใกล้เคียงสีโอรส) ส่วนสีที่กลมกลืนที่สุดคือสีข้างเคียง #87EBD6 และ #879CEB ทุกค่าด้านล่างคำนวณจากฟ้าท้องฟ้า #87CEEB ด้วยการหมุนค่าเฉดสี (Hue) ในระบบ HSL โดยคงความสด (Saturation) และความสว่าง (Lightness) ไว้เท่าเดิม ชื่อที่กำกับใต้สีคือเฉดในคลังที่ดูใกล้เคียงที่สุด ถ้าไม่มีเฉดไหนใกล้พอจะแสดงเพียงองศาที่หมุน หลักการของแต่ละแบบอ่านต่อได้ที่ สีคู่ตรงข้าม และ วงจรสี

  • คู่ตรงข้าม Complementary · +180°

    ตัดกันแรงที่สุด ใช้สีหนึ่งเป็นสีหลักและให้อีกสีเป็นจุดเน้นเล็ก ๆ เช่น ปุ่มหรือหัวข้อ

    #87CEEB

    ฟ้าท้องฟ้า สีตั้งต้น

  • สีข้างเคียง Analogous · -30° / +30°

    กลมกลืนและสบายตา เหมาะกับพื้นหลัง ภาพประกอบ และงานที่ต้องการอารมณ์เดียวกันทั้งหน้า

    #87CEEB

    ฟ้าท้องฟ้า สีตั้งต้น

  • สามเส้า Triadic · +120° / +240°

    สดใสและสมดุล ควรให้สีหนึ่งเด่นที่สุด แล้วใช้อีกสองสีเป็นสีรองในพื้นที่เล็กกว่า

    #87CEEB

    ฟ้าท้องฟ้า สีตั้งต้น

    #EB87CE

    ไม่มีชื่อเฉดในคลัง +120°

    #CEEB87

    ไม่มีชื่อเฉดในคลัง +240°

  • คู่ตรงข้ามแยก Split complementary · +150° / +210°

    ตัดกันชัดแต่ไม่แรงเท่าคู่ตรงข้าม จับคู่ง่ายกว่าและพลาดยากกว่า

    #87CEEB

    ฟ้าท้องฟ้า สีตั้งต้น

ตัวหนังสือบนสีฟ้าควรเป็นสีอะไร

บนฟ้าท้องฟ้า #87CEEB ตัวหนังสือสีดำอ่านง่ายกว่า ได้ค่าคอนทราสต์ 12.05:1 ส่วนตัวหนังสือสีขาวได้ 1.74:1 เกณฑ์ขั้นต่ำของ WCAG 2.2 (ระดับ AA) คือคอนทราสต์ระหว่างตัวหนังสือกับพื้นหลังอย่างน้อย 4.5:1 สำหรับตัวหนังสือขนาดปกติ และ 3:1 สำหรับตัวหนังสือขนาดใหญ่ (อย่างน้อย 18pt หรือ 14pt ตัวหนา) ตารางด้านล่างคำนวณค่านี้ให้สีฟ้าอีกหลายเฉด เพื่อเลือกสีตัวหนังสือได้ถูกตั้งแต่แรก

ตัวหนังสือสีขาว Aa 1.74:1 · ไม่ผ่าน
ตัวหนังสือสีดำ Aa 12.05:1 · ผ่าน
เฉดตัวหนังสือขาวตัวหนังสือดำ
ฟ้าไซแอนอ่อน#E0FFFF 1.05:1 ไม่ผ่าน 19.91:1 ผ่าน · แนะนำ
ฟ้าแป้ง#B0E0E6 1.43:1 ไม่ผ่าน 14.65:1 ผ่าน · แนะนำ
ฟ้าเหล็กอ่อน#B0C4DE 1.78:1 ไม่ผ่าน 11.79:1 ผ่าน · แนะนำ
ฟ้าท้องฟ้า#87CEEB 1.74:1 ไม่ผ่าน 12.05:1 ผ่าน · แนะนำ
ฟ้าด็อดเจอร์#1E90FF 3.23:1 ผ่านเฉพาะตัวใหญ่ 6.48:1 ผ่าน · แนะนำ
ฟ้าอมเทาคาเด็ต#5F9EA0 3.05:1 ผ่านเฉพาะตัวใหญ่ 6.88:1 ผ่าน · แนะนำ
ฟ้าไซแอนงานพิมพ์#00AEEF 2.52:1 ไม่ผ่าน 8.30:1 ผ่าน · แนะนำ

สีฟ้าให้ความรู้สึกแบบไหน

พจนานุกรมฉบับราชบัณฑิตยสถานให้ความหมายของคำว่า "ฟ้า" ในฐานะชื่อสีว่า "สีน้ำเงินอ่อนอย่างสีท้องฟ้าในเวลามีแดด เรียกว่า สีฟ้า" ซึ่งเป็นนิยามที่ใช้อ้างอิงได้เมื่อต้องอธิบายสีนี้เป็นภาษาไทย

สีฟ้าอ่อนดูสบายตาและไม่กดดัน จึงเหมาะกับพื้นหลังเว็บไซต์ งานสุขภาพ งานเด็ก และแบรนด์ที่อยากดูเข้าถึงง่าย ส่วนฟ้าสดอย่างฟ้าด็อดเจอร์หรือฟ้าเซรูเลียนมีพลังพอจะใช้เป็นสีปุ่มหรือสีลิงก์ได้

ฟ้าอมเขียวอย่างเทอร์ควอยซ์และฟ้าน้ำทะเลให้อารมณ์ชายหาดและฤดูร้อน ใช้ได้ดีในงานท่องเที่ยว ร้านเครื่องดื่ม และโปสเตอร์กิจกรรมกลางแจ้ง

ความหมายของสีในวัฒนธรรมไทย เช่น สีกับงานมงคลและงานพิธี อ่านต่อได้ที่ จิตวิทยาสีไทย

เคล็ดลับใช้สีฟ้าในงานออกแบบ

หลักง่าย ๆ คือให้สีฟ้ามีบทบาทเดียวในงาน จะเป็นสีหลัก สีพื้น หรือสีเน้นก็ได้ แล้วเลือกสีอื่นมารับบทที่เหลือให้ชัดเจน เคล็ดลับด้านล่างใช้ได้ทั้งงานพิมพ์และงานบนจอ

  • ฟ้าอ่อนมากอย่างฟ้าน้ำแข็ง หรือขาวอมฟ้าอย่างขาวอลิซบลู เหมาะเป็นพื้นหลังกล่องข้อความ แทนสีเทาที่ดูแห้ง
  • ตัวหนังสือสีขาวบนฟ้าอ่อนมักอ่านยาก ให้ใช้ตัวหนังสือสีกรมท่าหรือสีดำแทน ดูค่าคอนทราสต์ในตารางด้านบน
  • ฟ้าคู่กับชมพูพาสเทลหรือเหลืองอ่อนให้ภาพสดใสแบบงานเด็กและงานเทศกาล
  • ฟ้าอมเขียวคู่กับส้มคอรัลเป็นคู่สีตรงข้ามที่สดแต่ไม่แสบตา

วิธีนำโค้ดสีฟ้าไปใช้

แตะค่า HEX ในตารางเพื่อคัดลอก แล้ววางในช่องรหัสสีของโปรแกรมได้ทันที ใช้ได้ทั้ง Canva, Figma, Photoshop และ Illustrator ส่วน Microsoft Word ให้ไปที่ More Colors แล้ววางค่า HEX ในช่อง Hex ของแท็บ Custom (Word รุ่นเก่าที่ไม่มีช่องนี้ให้ใส่ค่า RGB แทน) ขั้นตอนของแต่ละโปรแกรมอยู่ที่ หน้ารวมโค้ดสี ถ้ามีโค้ดสีในรูปแบบอื่นอยู่แล้ว เช่น CMYK จากโรงพิมพ์ แปลงกลับเป็น HEX ได้ที่ เครื่องมือแปลงโค้ดสี

โค้ดสีตระกูลอื่น

ThaiGraph รวมโค้ดสีไว้ 19 ตระกูล รวม 450 เฉด เลือกตระกูลที่ต้องการด้านล่าง หรือดูทุกเฉดในหน้าเดียวพร้อมช่องค้นหาที่ รวมโค้ดสี ส่วนสีไทยโบราณอยู่ที่ สีไทย Thaitone

ตรวจสอบข้อมูลเมื่อ November 2026

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

  1. ค่า HEX ของเฉดที่มีป้าย "มาตรฐาน CSS" ทั้ง 15 เฉด (เช่น lightblue = #ADD8E6) ตามตารางชื่อสีมาตรฐาน—W3C, CSS Color Module Level 4 — §6.1 Named Colors (accessed Nov 3, 2026)
  2. ความหมายของคำว่า "ฟ้า": "สีน้ำเงินอ่อนอย่างสีท้องฟ้าในเวลามีแดด เรียกว่า สีฟ้า"—พจนานุกรมฉบับราชบัณฑิตยสถาน (ฉบับออนไลน์) สำนักงานราชบัณฑิตยสภา (accessed Nov 3, 2026)
  3. โค้ด HEX 6 หลักคือค่าแดง เขียว และน้ำเงิน คู่ละ 2 หลัก ในระบบเลขฐานสิบหก—W3C, CSS Color Module Level 4 — §5.2 The RGB Hexadecimal Notations (accessed Nov 3, 2026)
  4. เกณฑ์คอนทราสต์ขั้นต่ำ 4.5:1 สำหรับตัวหนังสือขนาดปกติ และ 3:1 สำหรับตัวหนังสือขนาดใหญ่ (อย่างน้อย 18pt หรือ 14pt ตัวหนา)—W3C, Understanding WCAG 2.2 — Success Criterion 1.4.3 Contrast (Minimum) (accessed Nov 3, 2026)