Contrast playground · 20 × 20

เปลี่ยนพื้น แล้วเห็นอีกมุม

ลายเดิม พื้นใหม่ อารมณ์ก็เปลี่ยน ลองจับคู่ 20 ชิ้นกับ 20 พื้น แล้วพาคู่ที่ใช่ไปต่อในงานของคุณ

dial · quiet

dial · quietsurface.canvas · #F6F7F3

ตัวอย่างส่วนอ่อนสุด
1.23 : 1
ตัวอย่างส่วนเด่นสุด
1.62 : 1

บางส่วนยังเบาอยู่

ตัวอย่างสีที่คำนวณ: #59D2FE / Alpha จากไฟล์ต้นฉบับ: 0.4–1

เป็นช่วงค่าของสีและ alpha ที่ระบุในชุดส่งต่อ ไม่ใช่ทุกพิกเซลหรือผลรับรอง accessibility ของทั้งชิ้น

ดาวน์โหลดชิ้นนี้

ตัวเลขนี้บอกอะไร และยังไม่ได้บอกอะไร

เราผสมสีตัวอย่างกับพื้นตาม alpha ที่ระบุ แล้วคำนวณอัตราส่วน luminance จากสี sRGB แสดงทั้งค่าน้อยสุดและมากสุดของชุดตัวอย่าง ไม่สรุปว่าทั้งภาพผ่านจากส่วนที่ชัดที่สุด โลโก้สีและ CityChat มีสีอื่นนอกเหนือจากตัวอย่างนี้ ขอบที่มี anti-alias และภาพซ้อนจริงยังไม่ได้วัด

พื้น gradient แสดงเป็น stop สีทึบหนึ่งจุด จึงต้องตรวจทุก stop และตำแหน่งใช้งานจริง ส่วน overlay.glass เป็นค่าประมาณที่ขึ้นกับพื้นด้านหลัง ขนาดที่ขยายช่วยให้สังเกตได้ แต่ไม่เปลี่ยน contrast ratio ลายตกแต่งควรมี alt="" ส่วนข้อมูลสำคัญต้องมีข้อความและตรวจองค์ประกอบที่สื่อความหมายแยกต่างหาก

Five small moves

ถ้ายังไม่ลงตัว ลองทีละก้าว

ให้พื้น พื้นที่ว่าง และการเลือกไฟล์ช่วยเล่าเรื่อง โดยเก็บลายต้นฉบับไว้ครบ

  1. L1

    วัดกับงานจริง

    ดูทั้งส่วนเด่นและส่วนอ่อน บนพื้นและขนาดที่จะส่ง ตรวจทุก stop เมื่อใช้ gradient

  2. L2

    ลองพื้นอีกแบบ

    เลือกพื้นในชุดที่เหมาะกับบริบท แล้ววัดอีกครั้ง ไม่เติมแผ่นรองหรือสีใหม่เพื่อกลบปัญหา

  3. L3

    สลับไฟล์ที่มีให้

    ลอง full / quiet, ijji ink / mint หรือ CityChat light / dark โลโก้เลือก rendition โดยคงสีต้นฉบับ

  4. L4

    ให้พื้นที่กับลาย

    ขยายตามความเหมาะสม แยกจากคอลัมน์ข้อความ หรือเพิ่มพื้นที่ว่าง ขนาดไม่ทำให้ค่า contrast สูงขึ้น

  5. L5

    เว้นลาย ก็เล่าได้

    ถอดลายออกได้เสมอ ข้อความ ปุ่ม และสถานะจริงยังต้องเล่าเรื่องได้ครบด้วยตัวเอง

แนวทางจากชุดส่งต่อ: ใช้ช่วยตัดสินใจเรื่องการวาง ไม่ใช่การประกาศกติกา Design System ใหม่ ตรวจไฟล์จริงและบริบทปลายทางทุกครั้ง · อ่านไฟล์อ้างอิงต้นฉบับ

Official identity · 12 original files

โลโก้ที่ใช่ บนพื้นของคุณ

เลือกจากไฟล์ identity ทั้ง 12 แบบ ลองพื้นสว่างและมืดก่อนหยิบไปใช้ใน navigation, co-branding หรือเอกสาร

Landometer · Symbol color
Symbol · color · 1601 × 1601 pxcanvas · #F6F7F3

เริ่มที่พื้นสว่าง ฐานสีน้ำเงินอาจกลืนกับ Brand Blue คงทุกสีตามไฟล์เดิม

ดาวน์โหลด PNG นี้

เปิดไฟล์ identity ทั้ง 12 แบบ

ทุกไฟล์คงไบต์เดิมจากชุดแนบ รุ่น cream ยังเป็น #EFEFD0 และรุ่น gray ไม่ได้ชัดบนทุกพื้น เปลี่ยน rendition หรือพื้นที่แวดล้อมตามงานจริง