ข้ามไปยังเครื่องมือเลือกสี

แปลง SwiftUI เป็น OKLCH

วางค่า SwiftUI แล้วได้ OKLCH ทันที ใช้รูปแบบอื่นก็ได้เช่นกัน

อ่านเป็น โค้ด Swift

ค่า OKLCHoklch(68.031% 0.21005 33.68)
OKLCH เป็น SwiftUI

ปรับสี

11°
100%

68%
0.210
34°

รูปแบบอื่นทั้งหมด

ตัวอย่างการแปลง SwiftUI เป็น OKLCH

สีSwiftUIOKLCH
Color(red: 1, green: 0, blue: 0)oklch(62.796% 0.25768 29.234)
Color(red: 0, green: 1, blue: 0)oklch(86.644% 0.29483 142.495)
Color(red: 0, green: 0, blue: 1)oklch(45.201% 0.31321 264.052)
Color(red: 1, green: 1, blue: 1)oklch(100% 0 0)
Color(red: 0, green: 0, blue: 0)oklch(0% 0 0)
Color(red: 0.502, green: 0.502, blue: 0.502)oklch(59.987% 0 0)
Color(red: 1, green: 0.341, blue: 0.2)oklch(68.036% 0.21001 33.692)
Color(red: 0.231, green: 0.51, blue: 0.965)oklch(62.308% 0.18801 259.815)
Color(red: 0.063, green: 0.725, blue: 0.506)oklch(69.587% 0.14907 162.48)
Color(red: 0.961, green: 0.62, blue: 0.043)oklch(76.859% 0.16466 70.08)
Color(red: 0.545, green: 0.361, blue: 0.965)oklch(60.563% 0.21892 292.717)
Color(red: 0.925, green: 0.282, blue: 0.6)oklch(65.592% 0.21177 354.308)

เกี่ยวกับ SwiftUI และ OKLCH

SwiftUI กำหนดสีด้วยค่าแดง เขียว และน้ำเงินตั้งแต่ 0 ถึง 1 เขียนเป็น Color(red: 1, green: 0.341, blue: 0.2) ส่วนความทึบเพิ่มด้วยพารามิเตอร์ opacity

OKLCH คือ OKLab ในรูปพิกัดเชิงขั้ว: ความสว่าง ความสด และฮิว Tailwind CSS v4 ใช้กับพาเลตทั้งหมด เพราะเปลี่ยนความสว่างแล้วฮิวยังคงที่

การแปลงทำงานอย่างไร

เราอ่านค่า SwiftUI แปลงเป็น CIE XYZ ด้วยเมทริกซ์จากข้อกำหนด CSS Color 4 แล้วแปลงต่อเป็น OKLCH ค่าที่อยู่นอกขอบเขตสีปลายทางจะถูกปรับด้วยอัลกอริทึมของ CSS Color 4 ซึ่งคงความสว่างและฮิวไว้ แล้วลดความสดลง

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

แปลง SwiftUI เป็น OKLCH อย่างไร

วางหรือพิมพ์ค่า SwiftUI ลงในช่องด้านบน PickShade จะแปลงด้วยสูตร CSS Color 4 ทันทีที่พิมพ์ และคลิกเดียวก็คัดลอกค่า OKLCH ได้

การแปลง SwiftUI เป็น OKLCH แม่นยำหรือไม่

การคำนวณแม่นยำ ผลลัพธ์ถูกปัดเศษเฉพาะตอนแสดงผล โดยเหลือทศนิยมพอที่จะแปลงกลับเป็นสีเดิมได้ หากสีไม่อยู่ในขอบเขตสีปลายทาง PickShade จะเตือนและแสดงสีที่ใกล้ที่สุดที่อยู่ในขอบเขต

ได้รูปแบบอื่นพร้อมกันด้วยไหม

ได้ รูปแบบอื่นทั้งหมด รวมถึง OKLCH, Display P3, Tailwind, SwiftUI, Flutter และ Android แสดงอยู่ใต้ผลลัพธ์ และคัดลอกได้ในคลิกเดียว

ตัวแปลงนี้ใช้ฟรีไหม

ฟรี ไม่ต้องสมัคร และทำงานในเบราว์เซอร์ของคุณทั้งหมด