OKLCH คืออะไร

 (jakub.kr)
11 คะแนน โดย GN⁺ 2025-08-26 | 1 ความคิดเห็น | แชร์ทาง WhatsApp
  • OKLCH คือ โมเดลสีสมัยใหม่ที่ออกแบบให้สอดคล้องกับการรับรู้ทางสายตาของมนุษย์ โดยมีคุณสมบัติที่ทำให้ การเปลี่ยนแปลงของความสว่าง ความอิ่มสี และเฉดสีระหว่างสีต่าง ๆ รู้สึกสม่ำเสมอ จึงเป็น โมเดลสีแบบสม่ำเสมอเชิงการรับรู้
  • โครงสร้างประกอบด้วย Lightness(ความสว่าง), Chroma(ความอิ่มสี), Hue(เฉดสี) และเมื่อเทียบกับโมเดลเดิมจะช่วยให้ สร้างชุดสีที่มีความสม่ำเสมอ ได้
  • สามารถสร้างพาเลตสีที่สม่ำเสมอได้แม้จะ เปลี่ยนเฉพาะ Hue โดยคงความสว่างและความอิ่มสีเท่าเดิม จึงเหมาะกับงานออกแบบ UI
  • เมื่อเทียบกับ sRGB/HSL จะให้ การเปลี่ยนระดับแสงเงาที่คาดเดาได้และไล่สีที่สม่ำเสมอ แต่ในบางกรณีอาจเกิดสีที่ไม่ได้ตั้งใจได้
  • บน จอแสดงผลสมัยใหม่อย่าง Display-P3 สามารถแสดงสีได้กว้างขึ้น และเบราว์เซอร์สมัยใหม่ก็รองรับผ่าน CSS Color 4 พร้อมทั้งมี การทำ sRGB fallback ทำให้กำลังกลายเป็นมาตรฐานเว็บมากขึ้นเรื่อย ๆ

แนะนำโมเดลสี OKLCH

  • OKLCH เป็นโมเดลสีสมัยใหม่ที่พัฒนาขึ้นโดยมีเป้าหมายเรื่อง ความสม่ำเสมอเชิงการรับรู้ (perceptually uniform)
  • โมเดลนี้ทำงานใกล้เคียงกับ วิธีที่มนุษย์รับรู้สีจริง ๆ มากกว่า จึงทำให้ การจัดการสีสะดวกขึ้นมาก ในงานออกแบบดิจิทัลและการพัฒนาฟรอนต์เอนด์

แนวคิดพื้นฐานของโมเดลสี

  • โมเดลสี คือ ระบบ ที่ใช้นิยามและแสดงสีในเชิงคณิตศาสตร์
  • ตัวอย่างโมเดลที่ใช้กันบ่อย: RGB, HSL, LCH, OKLCH, LAB, XYZ
  • แต่ละโมเดลจะกำหนด ความสะดวกในการแสดงผลและการจัดการสี

ตัวอย่างวิธีเขียนค่าสี

  • oklch(0.55 0.18 260)
  • hsl(220 100% 50%)
  • rgb(0, 128, 255)
  • lch(60% 60 260)
  • lab(50 -10 -50)
  • color(xyz 0.18 0.19 0.6)
  • #1E90FF

Gamut(ขอบเขตของปริภูมิสี)

  • Gamut หมายถึง ช่วงสีทั้งหมด ที่โมเดลสีนั้นสามารถแสดงได้
  • gamut ที่เป็นตัวแทนได้แก่ sRGB(ค่ามาตรฐานบนเว็บ), Display-P3(รองรับบนอุปกรณ์สมัยใหม่)
  • ปริภูมิสีมีคุณสมบัติหลายอย่างนอกเหนือจาก ขอบเขต gamut เช่น white point, transfer function
โฆษณา

โครงสร้างของ OKLCH

ทั้ง OKLCH และ LCH ต่างก็ประกอบด้วยสามค่า คือ Lightness, Chroma, Hue
OKLCH อ้างอิงจากปริภูมิสี OKLab

  • Lightness(ความสว่าง/ความสว่างสัมพัทธ์) : แสดงเป็น 0~1 หรือ 0%~100% และช่วยให้ การเปลี่ยนแปลงความสว่างมีความสม่ำเสมอ
  • Chroma(ความอิ่มสี) : ความเข้มของสี คล้ายกับ Saturation(ความอิ่มสี) ใน HSL
  • Hue(เฉดสี) : แสดงสีด้วยมุม 0~360 องศา

ข้อดีและการใช้งานของ OKLCH

  • ความสว่างที่สม่ำเสมอ

    • ใน OKLCH หากกำหนดสีด้วย ค่าความสว่างและความอิ่มสีเท่าเดิม แล้วเปลี่ยนเฉพาะ hue จะทำให้ ทุกสีถูกรับรู้ว่ามีความสว่างใกล้เคียงกัน
    • ใน sRGB หรือ HSL แบบเดิม ความสว่างหรือความอิ่มสีอาจดูไม่สม่ำเสมอตามแต่ละสี
    • ดังนั้น OKLCH จึงเหมาะกับการสร้าง พาเลตสีที่สม่ำเสมอเชิงการรับรู้ ได้ง่าย

  • ระดับความสว่างของสีที่คาดเดาได้

    • ใน OKLCH เมื่อ เปลี่ยนค่าความสว่าง ก็สามารถสร้างระดับสีหลายขั้นได้ โดยไม่ทำให้ hue(เฉดสี) หรือ chroma(ความอิ่มสี) เปลี่ยนไป
    • ใน HSL เป็นต้น เมื่อความสว่างเปลี่ยน มักเกิดอาการ drift ที่เฉดสีเลื่อนไปด้วย
    • OKLCH ทำให้สร้างระดับความสว่างของสีที่สม่ำเสมอได้ด้วยการปรับเพียงความสว่าง

  • วิธีจัดการไล่สี (Gradients)

    • ใน sRGB จะเป็นการ interpolate ระหว่างค่าแดง เขียว น้ำเงิน ทำให้จุดกึ่งกลางดูหม่นหรือเกิดการเปลี่ยนความสว่างมากเกินไป
    • OKLCH จะ interpolate ตามแกน Lightness, Chroma, Hue จึงสร้างไล่สีที่ดูเป็นธรรมชาติมากกว่าได้
    • อย่างไรก็ตาม เนื่องจาก ค่า Hue มีโครงสร้างแบบวงกลม จึงอาจเกิดการเพี้ยนของสีที่ไม่คาดคิดได้
    • เพื่อหลีกเลี่ยงปัญหานี้ สามารถทำการ interpolate แบบเส้นตรงใน OKLab เพื่อให้ได้ผลลัพธ์ที่คาดเดาได้มากกว่า
    โฆษณา

การรองรับปริภูมิสี

  • sRGB ไม่สามารถครอบคลุมสีบางส่วนในปริภูมิสีที่กว้างของจอแสดงผลสมัยใหม่ได้
  • เมื่อใช้ OKLCH จะสามารถ แสดงสีได้สดขึ้นบนอุปกรณ์ที่รองรับช่วงสีกว้าง เช่น Display-P3
  • บนอุปกรณ์ที่รองรับเพียง sRGB สีจะถูก แมปให้ใกล้เคียงที่สุดเท่าที่ทำได้

ค่า Chroma(ความอิ่มสี) สูงสุด

  • OKLCH สามารถระบุสีในเชิงคณิตศาสตร์ได้แม้จะอยู่นอกช่วงที่หน้าจอจริงแสดงผลได้
  • ตัวอย่างเช่น ค่า chroma ที่สูงเกินไปอย่าง oklch(0.7 0.4 40) ไม่สามารถแสดงผลจริงได้ จึงถูก clipping เป็นสีใกล้เคียง
  • จึงสำคัญที่จะต้องเข้าใจ แนวคิดเรื่อง chroma สูงสุด และตั้งค่าให้เหมาะสมตามเฉดสี ความสว่าง และปริภูมิสีที่เลือกใช้ (sRGB, Display-P3)

การรองรับของเบราว์เซอร์และ fallback

  • สีแบบ OKLCH ถูกนำมาใช้ใน CSS Color Module Level 4 และ เบราว์เซอร์สมัยใหม่ส่วนใหญ่รองรับแล้ว
  • ในเบราว์เซอร์รุ่นเก่าอาจยังไม่รองรับ จึงสามารถตั้งค่า fallback ด้วยคำสั่ง CSS @supports ได้ 
    @layer base {  
  :root {  
    /* sRGB hex */  
    --color-gray-100: #fcfcfc;  
    --color-gray-200: #fafafa;  
    --color-gray-300: #f4f4f4;  

    @supports (color: oklch(0 0 0)) {  
      /* OKLCH */  
      --color-gray-100: oklch(0.991 0 0);  
      --color-gray-200: oklch(0.982 0 0);  
      --color-gray-300: oklch(0.955 0 0);  
    }  
  }  
}
  • ในเบราว์เซอร์ที่รองรับจะใช้ OKLCH ส่วนเบราว์เซอร์ที่ไม่รองรับจะใช้สี sRGB(hex)

เครื่องมือ oklch.fyi

  • oklch.fyi เป็นเครื่องมือบนเว็บที่มีฟังก์ชันเกี่ยวกับ OKLCH เช่น การสร้างพาเลตสี และการแปลงเป็นตัวแปร CSS
  • ช่วยให้การนำสีแบบ OKLCH ไปใช้ในระบบดีไซน์หรือการพัฒนาธีมทำได้ง่ายขึ้น

บทความที่เกี่ยวข้อง

1 ความคิดเห็น

 
GN⁺ 2025-08-26
ความคิดเห็นบน Hacker News

  • เริ่มสงสัยกับฟีเจอร์ “Better Gradients” อยู่บ้าง OKLCH เป็นสเปซแบบพิกัดเชิงขั้ว และในสเปซนี้ Hue ทำหน้าที่เป็นมุม เมื่อทำ interpolation ระหว่างสีสองจุดที่ต่างกัน เส้นทางจะวิ่งไปตามขอบของวงกลม ตัวอย่างเช่น ถ้าใช้โค้ด linear-gradient(in oklch, #f0f, #0f0) ระหว่างเขียวกับม่วงจะเห็นชัดว่าสีออกนอกขอบเขตสีที่แสดงได้อย่างเด่นชัด ถ้าหมุนวงกลมไปอีกทิศทางหนึ่งก็จะได้แบบ linear-gradient(in oklch longer hue, #f0f, #0f0) ซึ่งจะผ่านโทน teal หรือ aqua ปัญหานี้แสดงให้เห็นว่าการจัดการกับขอบเขตของสเปซสีเชิงการรับรู้ ไม่ว่าจะเป็น sRGB หรือขอบเขตสีที่มนุษย์มองเห็นได้จริง หรือ gamut นั้นค่อนข้างลำบากมาก ในทางปฏิบัติ แค่ค่าต่างกันเพียงเล็กน้อยสีก็หลุดช่วงได้แล้ว มีอัลกอริทึมหลายแบบที่พยายามแก้เรื่องนี้ แต่ต้องแลกกับความสม่ำเสมอเชิงการรับรู้ ตัวอย่างเช่น สีแดงบนกราเดียนต์จะดูมืดผิดปกติ ถ้าต้องการกราเดียนต์ที่ดีกว่าและให้ความสำคัญกับ perceptual uniformity จริง ๆ อันที่จริงควรใช้งานการ interpolate แบบ Oklab เป็นค่าปริยาย Oklab จะ interpolate เป็นเส้นตรงตัดผ่านวงกลม และถ้าจำเป็นก็อาจผ่านสีเทาได้ (linear-gradient(in oklab, #f0f, #0f0)) วิธีนี้ยังช่วยกำจัดอาการมืดลงแบบที่เห็นบ่อยในการ interpolate แบบ sRGB และให้กราเดียนต์จาก magenta ไป lime ที่เป็นธรรมชาติกว่า อ้างอิงเพิ่มเติมคือ Tailwind v4 เคยใช้ Oklch แทน sRGB ในช่วงเบต้า แต่ตอนออกตัวจริงเลือก Oklab เป็นค่าเริ่มต้นที่ปลอดภัยกว่า

    • ผมคิดว่าวิธีที่เบราว์เซอร์ interpolate สีใน sRGB นั้นแทบจะเป็นบั๊กด้วยซ้ำ sRGB เป็นการเข้ารหัสแบบสเกลลอการิทึม ดังนั้นตามสเปกเดิมไม่ควร interpolate สีใน sRGB โดยตรง แต่ควรแปลงเป็น linear RGB ก่อนแล้วจึง interpolate

    • บทความนี้ถูกแก้ไขแล้ว ดังนั้นจะมองข้ามคอมเมนต์ของผมก็ได้ ถึงอย่างนั้นก็ยังเห็นด้วยว่าควรใช้การ interpolate แบบ Oklab เป็นค่าปริยาย ในบทความเองก็เขียนเรื่อง “กราเดียนต์ที่ดีกว่า” ไว้ว่า hue ของ OKLCH เป็นแบบวงกลม จึงอาจพาไปตามเส้นทางที่คาดไม่ถึง เพื่อหลีกเลี่ยงปัญหานี้ เครื่องมือจำนวนมากจึงใช้ OKLAB และ Oklab ให้ผลลัพธ์สม่ำเสมอด้วยเส้นทางแบบเส้นตรง

    • ที่จริง CIE LAB ก็ทำหน้าที่แบบเดียวกันและเป็นมาตรฐานที่มีอยู่แล้ว (CIE LAB บนวิกิพีเดีย)
      เอกสารทบทวนของ W3C

    • ขอบคุณสำหรับคำอธิบายที่มีประโยชน์มาก ผมเป็นคนเขียนบทความนี้เอง เดี๋ยวจะปรับเนื้อหาเพื่อให้ชัดเจนขึ้น

    • การทำกราเดียนต์ด้วยสีสองสีที่อยู่คนละฝั่งของสเปกตรัมเป็นกรณีที่ค่อนข้างสุดโต่งอยู่แล้ว ก็ไม่มีคำตอบที่ถูกต้องตายตัวว่าควรออกมาเป็นอย่างไร และในงานออกแบบจริงก็น่าจะไม่ค่อยมีความจำเป็นต้องใช้กราเดียนต์แบบนั้น ปกติเวลาใช้กราเดียนต์ในงานออกแบบก็มักจะเลือกสีตรงกลางเองอยู่แล้ว

  • สำหรับ OKLCH นั้น oklch.com ช่วยให้สร้างความเข้าใจเชิงสัญชาตญาณได้ดี แต่ต้องระวังว่า hue ไม่เหมือนกับ hue ใน HSL และค่าสูงสุดของ chroma ก็เปลี่ยนไปตาม hue และ lightness ด้วย นี่ไม่ใช่บั๊ก แต่สะท้อนลักษณะการมองเห็นของมนุษย์และข้อจำกัดของจอแสดงผล ต่างจาก HSL ที่ค่าสูงสุดดูเหมือนคงที่เสมอ แต่ความหมายของสีกลับไม่สม่ำเสมอ จุดเด่นของ OKLCH ใน CSS คือสามารถจัดการในรูปแบบสูตรได้ เช่น oklch(from var(--accent) calc(l + .1) c h) แต่ถ้าจะใช้สูตรเหล่านี้ให้ดีจริง ๆ ก็ต้องมีความรู้เรื่องทฤษฎีสีหรืออย่างน้อยต้องลองทดสอบ เช่น ตอนแรกผมคิดว่าเงาแค่เปลี่ยน lightness ก็พอ แต่จริง ๆ hue ก็ควรเปลี่ยนด้วย ไม่ได้หมายความว่ากราเดียนต์แบบ OKLCH จะดีที่สุดเสมอไป แม้เวลาสีอยู่ในช่วง hue ใกล้กันจะดูสม่ำเสมอดี แต่ถ้าสนใจว่าการผสมแสงจริง ๆ เปลี่ยนไปทางกายภาพอย่างไร ก็ต้องใช้สเปซสี XYZ แทน เรื่องนี้ดูเพิ่มได้จาก เอกสาร color-mix ของ MDN อ้อ แล้วคำว่า ‘ok’ ก็หมายถึง OK ตรง ๆ จริง ๆ ตั้งชื่อตามความหมายว่า LCH แบบเดิมมีปัญหา คือไม่โอเคนัก

    • คุณบอกว่าข้อดีคือ CSS OKLCH เขียนสูตรได้ แต่จริง ๆ การจัดการสีแบบ relative color ใช้ได้กับทุก color space ใน CSS เช่น background-color: rgb(from var(--base-color) calc(r - 76.5) g calc(b + 76.5));

    • OKLCH กับ relative color ช่วยให้ผมลดจำนวนสีที่ต้อง hardcode ไว้ใน stylesheet ได้มาก
      ตัวอย่างตัวแปร CSS

  • มีข้อวิจารณ์บางส่วนที่ถูกพูดถึงไปแล้ว แต่โดยรวมผมคิดว่านี่เป็นบทความแนะนำ OKLCH และวิธีใช้ใน CSS ที่ค่อนข้างดี คำถามต่อยอดคือช่วงหลัง ๆ ผมเริ่มสงสัยกับเทรนด์การไม่ใส่วันที่ในบล็อกโพสต์ โดยเฉพาะประโยคอย่าง “OKLCH เป็นโมเดลสีใหม่” ที่น่าจะดูล้าสมัยเร็วมาก บนเว็บหลักเขียนแค่ “สิงหาคม 2025” เลยรู้สึกเหมือนตั้งใจหลีกเลี่ยงการใส่วันที่เต็ม
    เว็บไซต์ที่เกี่ยวข้อง

    • อธิบายไม่ถูกนัก แต่ผมคิดว่าบทความไม่มีวันที่เป็นปัญหาร้ายแรง ไม่รู้ว่านี่เป็นเทรนด์จริงไหม แต่พอไม่มีวันที่ก็ทำให้เข้าใจผิดว่าเป็นบทความเก่าได้ง่าย บางครั้งผมต้องเดาปีจาก timestamp ของคอมเมนต์ แต่บล็อกหลายแห่งก็ไม่รองรับคอมเมนต์เลย แบบนั้นยิ่งทำให้ไม่อยากกลับไปดูอีก (ในหน้าแรกของ OP เขียนว่า “ไม่หมกมุ่นกับรายละเอียด” แต่กลับดูหมกมุ่นกับความสวยงามของดีไซน์จนละเลยการใช้งานจริง ซึ่งก็น่าขันดี)

    • ถ้าบทความไม่มีวันที่ ผมมักจะลองดู Last-Modified header ตอนดึงเอกสาร HTML ผ่าน HTTP แต่บ่อยครั้งคนเขียนก็ไม่ได้ใส่ใจเรื่องวันที่ อย่างที่ชื่อ blog บอกอยู่แล้ว เดิมทีมันคือ [web]-log ซึ่ง timestamp เป็นองค์ประกอบหลัก แต่หลายคนเหมือนไม่เข้าใจเรื่องนี้ อ้างอิงเพิ่มเติม Last-Modified คือเวลาที่รีซอร์ส (HTML) นั้นถูกแก้ไขล่าสุด ถ้าเซิร์ฟเวอร์ไม่ได้ตั้งค่าแคชและ render ใหม่จาก backend ทุกครั้ง ค่านี้ก็อาจเปลี่ยนใหม่ตลอด
      ตัวอย่างปัญหานี้

    • ส่วนใหญ่เป็นกลยุทธ์ SEO เพื่อหลีกเลี่ยงไม่ให้คอนเทนต์เก่าถูกลดอันดับในเสิร์ชเอนจิน เป็นทริกที่น่ารำคาญมาก

    • เพราะ Google และ SEO นั่นแหละ

  • บทความบอกว่า OKLCH ให้สีน้ำเงินที่สม่ำเสมอกว่าเมื่อเทียบกับ HSL แต่ในความเป็นจริงการเปลี่ยนระดับความสว่างใน OKLCH กลับเลื่อนไปทางเขียวค่อนข้างมาก การคง perceptual intensity ให้สม่ำเสมอนั้นเป็นข้อดีชัดเจนก็จริง แต่ผมรู้สึกว่าผลลัพธ์ที่อ้างในที่นี้ถูกพูดเกินจริงไปหน่อย

    • ถ้าดูกราฟ hue ของสีนี้ก็จะเข้าใจเหตุผล
      แผนภูมิสี OKLCH
      เมื่อเพิ่มความสว่าง ก็จะทะลุขีดจำกัดของแถบ hue ของสีนั้น และเพราะข้อจำกัดของสีน้ำเงินสว่างที่จอแสดงผลสร้างได้ สีจึงเลื่อนไปทาง cyan OKLCH เวลาปรับความสว่างในกราเดียนต์ไม่ได้คง hue ไว้ แต่คง saturation ไว้แทน จะชอบเอฟเฟกต์นี้หรือไม่ก็เป็นเรื่องรสนิยมทางความงาม แต่หลังจากที่เราใช้เว็บคัลเลอร์แบบ hue คงที่และ desaturated มานาน ความรู้สึกที่ว่า “อย่างน้อยเรามีตัวเลือกว่าจะยอมประนีประนอมแบบไหน” ก็ดูสดใหม่ดี
      การถกเถียงบน Hacker News ที่เกี่ยวข้อง
      ช่วงหลังวงการวิทยาศาสตร์ก็เพิ่งสร้าง LED สีน้ำเงินที่ลึกกว่าเดิมได้ด้วย เลยหวังว่าอีก 10–20 ปีข้างหน้า ถ้ามีเทคโนโลยีมาแทน Display P3 เราอาจแสดงกราเดียนต์สีน้ำเงินได้แม่นยำขึ้นโดยไม่เกิดอาการ cyan shift แบบนี้ ระหว่างนี้ก็คงต้องยึดตามสิ่งที่ดูดีในเชิงดีไซน์ไปก่อน อีกอย่าง ในอนาคตการออกแบบ color space อาจไม่จำเป็นต้องเลือกแบบแบ่งขั้วระหว่าง hue กับ saturation เสมอไป บางทีอาจคง saturation ไว้จนถึงขีดจำกัดของจอ แล้วค่อยเปลี่ยนไปคง hue แบบค่อยเป็นค่อยไปเมื่อถึงจุดนั้น แต่เรื่องนี้ทำได้ยากมากเพราะข้อจำกัดของ color profile (IDCv4) ถึงอย่างนั้นก็น่าจะสนุกดีถ้าได้ลองทำเป็น target เชิงทดลองใน DisplayCAL

    • บนจอของผม ตัวอย่างนั้นไม่เห็นอาการเลื่อนไปทางเขียวเลย เลยสงสัยว่าหน้าจอของคุณอาจไม่ได้คาลิเบรตหรือเปล่า

    • เห็นด้วย สีเปลี่ยนจากน้ำเงินไปเป็น cyan เต็ม ๆ เลย ถ้า OKLCH ถูก implement แบบนี้จริง ผมไม่อยากใช้เด็ดขาด ดูเหมือนจะมีปัญหาร้ายแรงบางอย่างในวิธีคำนวณ hue ส่วน HSL/HSV แม้จะมีปัญหาเรื่อง perceptual lightness แต่ hue เองคงที่ตลอด จึงไม่ต้องแก้อะไร

    • ผมอาจไม่ค่อยรู้เรื่อง color science และนี่อาจเป็นความเห็นเชิงอัตวิสัย แต่ปลายด้านขวาสุดของสี OKLCH อย่างแย่ที่สุดก็ยังให้ความรู้สึกเป็น blue-green หรือแค่ light blue ขณะที่สองสีที่สว่างสุดของ HSL กลับไม่ดูเป็นสีน้ำเงินเลย สีรองจากขวาสุดดูเหมือน light purple มากกว่า และสีขวาสุดแทบจะเป็นสีเทา ในคำบรรยายบอกว่าด้านมืดของ HSL ออก grayish แต่สำหรับผมจริง ๆ แล้วซ้ายสุดที่มืดที่สุดทั้ง OKLCH และ HSL ก็ยังให้ความรู้สึกเป็นน้ำเงินเหมือนกัน ถ้าใช้ macOS Digital Color Meter วัด จะเห็นว่าค่า green ของสีขวาสุดใน OKLCH และ HSL แทบเท่ากัน (226 กับ 227 หรือใน sRGB คือ 228 กับ 227)

  • ขอแนะนำบทความที่ดีกว่าเกี่ยวกับหัวข้อนี้
    OKLCH in CSS: Why quit RGB, HSL ของ Evil Martians
    เครื่องมือแปลง OKLCH ที่ลองใช้ได้
    การถกเถียงบน Hacker News ก่อนหน้านี้ (6 เดือนก่อน, 30 คอมเมนต์)

  • OKLCH สร้างบนพื้นฐานของ OKLab (สเปซสีแบบ perceptual uniform) และเป็นโมเดลที่ใช้ปรับ Lightness (ความสว่าง), Chroma (ความอิ่มสี), และ Hue (เฉดสี) โดยคำว่า ‘OK’ มาจากการที่ผู้สร้างตอบว่ามัน “ใช้งานได้โอเคประมาณหนึ่ง”

    • ผมเดาว่า “OK” ใน OKLCH จริง ๆ อาจย่อมาจาก “Ottossons kulör” (ภาษาสวีเดนแปลว่า สีของ Ottosson) มากกว่า ผู้คิดค้นอาจถ่อมตัวเลยบอกว่าแค่ OK ก็ได้

  • ตอนทำงานกับสี รวมถึงข้อความและโลโก้ ผมคิดว่าควรคำนึงถึงคอนทราสต์และความอ่านง่ายด้วยเสมอ
    APCA Contrast

    • เว็บไซต์ข้างบนเหมาะถ้าจะใช้ algorithm วัดคอนทราสต์รุ่นใหม่ล่าสุด (APCA ซึ่งยังเป็น algorithm อย่างเป็นทางการของมาตรฐาน WCAG 3 ที่ยังไม่ออก) แต่ปัจจุบันหลายอุตสาหกรรมยังยึด WCAG 2 เป็นเกณฑ์ จึงต้องระวังข้อกำหนดทางกฎหมายด้วย
      เช็กคอนทราสต์ (WCAG 2)
      และยังมีเครื่องมืออื่นอีกหลากหลาย

  • ในหัวผม ชื่อ OKLCH ถูกตีความเป็น "Oklachroma" ไปเองโดยธรรมชาติ

  • มีบล็อกโพสต์ต้นฉบับที่แนะนำ color space แบบ OKLab ซึ่งน่าสนใจในเชิงประวัติศาสตร์
    โพสต์ต้นฉบับของ OKLab

  • ผมสงสัยว่าทำไมสูตรแปลงไปเป็น color space แบบ OKLCH ถึงไม่ค่อยถูกทำเอกสารไว้เลย ลองค้นใน Google ก็เจอแค่ Gist เดียว[0] ส่วน Oklab มีในวิกิพีเดีย[1]
    ตัวอย่างสูตรแปลงใน Gist
    Oklab บนวิกิพีเดีย

    • หัวใจของการแปลงอยู่ที่เมทริกซ์ระหว่าง Oklab กับ sRGB ส่วนการแปลง OKLab-OKLCH เองเป็นแค่การแปลงพิกัด ซึ่งมีอยู่ในวิกิพีเดียแล้ว

    • OKLCH และ OKLab เป็น color space เดียวกัน ต่างกันแค่วิธีแสดงผลแบบพิกัดฉาก (OKLab) กับพิกัดเชิงขั้ว (OKLCH)