Notion

จานสี

ยี่ห้อ

• Notion Blue #0075de — องค์ประกอบหลักที่เติมเต็มปุ่มกระตุ้นการดำเนินการ (CTA) ซึ่งเป็นจุดเด่นในการนำทางที่ใช้งานอยู่ ปุ่มการกระทำที่เติมเต็มสีนั้นเป็นโทนสีเดียวในระบบที่เกือบจะเป็นสีเดียว ซึ่งมีความอิ่มตัวของสีมากพอที่จะรับรู้ได้ว่าเป็นสวิตช์

เป็นกลาง

• Paper Warmth #f6f5f4 — พื้นหลังของหน้าเว็บ พื้นหลังของหน้าต่างหลัก และพื้นหลังของส่วนต่างๆ ล้วนเป็นสีโทนอบอุ่น ออกไปทางสีเบจเล็กน้อย ซึ่งทำให้ระบบมีสัมผัสที่ให้ความรู้สึกแบบอนาล็อก
• Pure White #ffffff — พื้นผิวการ์ด, แผงนูน, พื้นหลังโลโก้, ตัวอักษรตัดกันบนการ์ดสีเข้ม
• Ink Black #000000 — ข้อความหลัก ลิงก์นำทาง และหัวข้อต่างๆ ถูกนำมาใช้ร่วมกับระดับความโปร่งใสที่แตกต่างกัน (100%, 95%, 90%, 60%, 40%, 20%) เพื่อสร้างลำดับชั้นโดยไม่ต้องเพิ่มสีใหม่
• Charcoal #111111 — ตัวเลือกข้อความสีเข้มสำหรับพื้นที่ UI เหล่านั้นที่สีดำล้วนอาจดูแข็งกระด้างเกินไป
• Stone #757575 — ข้อความนำทางรอง, ข้อความช่วยเหลือที่ปิดเสียง, ป้ายกำกับปุ่มที่ปิดใช้งาน - ความโปร่งใสของหมึก 60%
• Graphite #615d59 — ตัวอักษรหลักมีโทนสีอบอุ่น คือสีเทาอมน้ำตาล ซึ่งกลมกลืนกับพื้นหลังโทนสีอบอุ่น

การจัดพิมพ์

จาก 12 เป็น 96 พิกเซล · 10 ขั้นตอน

• NotionInter — ทดแทน: Inter · โครงร่าง 400, 500, 600, 700 · แบบอักษรหลักที่เป็นแบบไม่มีเชิง (sans-serif) เป็นแบบเรขาคณิตเชิงมนุษยนิยมที่มีรายละเอียดปลีกย่อยอย่างประณีต โดยใช้ขนาด 400 สำหรับข้อความหลัก 500 สำหรับการนำทาง/ส่วนติดต่อผู้ใช้ และ 600-700 สำหรับหัวข้อ ขนาดของแบบอักษรใช้การเว้นระยะห่างระหว่างตัวอักษรแบบติดลบอย่างมากในขนาดที่ใหญ่ขึ้น (-4.6 พิกเซลที่ 96 พิกเซล, -2 พิกเซลที่ 72 พิกเซล) ซึ่งทำให้หัวข้อดูแน่นและมั่นใจมากขึ้น แทนที่จะดูโปร่งโล่ง
• Lyon Text — ทดแทน: Source Serif Pro · โครงร่าง 400 · แบบอักษร serif ที่ใช้ในงานบรรณาธิการ ซึ่งสงวนไว้สำหรับส่วนต่างๆ ของเนื้อหาหลักและบทนำของแต่ละส่วนนั้น ถูกใช้เพียงเล็กน้อย (สี่ครั้ง) เพื่อให้แบบอักษรมีน้ำหนักทางวรรณกรรม คล้ายกับคำคมในเลย์เอาต์นิตยสาร มันทำหน้าที่เป็นส่วนเน้นอย่างเป็นระบบมากกว่าจะเป็นลำดับชั้นคู่ขนาน

ช่วงเวลาและรูปแบบ

สไตล์ที่คล้ายกัน

• ElevenLabs — ภาพถ่ายเชิงสารคดีในโทนสีครีมอบอุ่น พร้อมหัวข้อข่าวที่ไม่ฉูดฉาด สมุดบันทึกสไตล์เบาเฮาส์—กระดาษสีเปลือกไข่ หมึกสีดำ และสีม่วงและสีส้มเพียงเล็กน้อยสำหรับตกแต่งเพื่อแสดงสินค้า
• Awesomic — แผ่นตาข่ายสังกะสีสำหรับงานบรรณาธิการ พร้อมเครื่องหมายวรรคตอนสีส้มที่ชวนให้นึกถึงกระดาษโปรย
• Monad — บทบรรณาธิการวารสารทางเทคนิคเกี่ยวกับกระดาษหนังอุ่น
• Dub — แผงควบคุมกระดาษข้าวแบบด้านของ Link
• Seline Analytics — โต๊ะวิเคราะห์ที่เงียบสงบ บนกระดาษอุ่นๆ
• Anthropic — วารสารภาคสนามทางวิทยาศาสตร์บนกระดาษหนังลูกวัวสีอบอุ่น—พื้นผิวสีงาช้างเรียบลื่น หัวข้อบรรณาธิการแบบมีเชิง และรายละเอียดสีดินเหนียวเพียงจุดเดียวที่ปรากฏขึ้นเฉพาะเมื่อจำเป็นต้องมีการดำเนินการ
• Calendly — หมึกสีน้ำเงินเข้มบนหินอ่อนเย็น
• Augen Pro — การตกแต่งสีขาวของ Apple โดดเด่นด้วยสีฟ้าสดใสที่ดูสะอาดตาและไร้น้ำหนัก เป็นเพียงสีเดียวที่ใช้เป็นจุดเด่นในพื้นที่สีขาวดำ
• Antimetal — บันทึกบรรณาธิการบนกระดาษสีครีม—เช้าอันเงียบสงบในวารสารวิทยาศาสตร์ ที่ซึ่งความยับยั้งชั่งใจสื่อถึงความมั่นใจ และตัวอักษรแบบมีเชิงช่วยเน้นความสำคัญ
• Perk — มะนาวไฟฟ้าบนกระดาษไขอุ่น
• Ditto — ห้องทำงานที่สว่างไสวด้วยแสงแดด กำลังสร้างสรรค์ตัวอย่างดอกไม้ป่า พื้นผิวสีครีมอบอุ่น สีเหลืองสดใสเป็นสีพื้นฐาน หมึกสีน้ำเงินเข้ม รูปทรงสีสันแบบธรรมชาติเบ่งบานอยู่ด้านหลังชิ้นงาน
• Officevibe — นิตยสารบทความบนกระดาษสีครีมโทนอบอุ่น ลองนึกภาพบทความเชิงลึกเกี่ยวกับการบริหารทรัพยากรบุคคล ที่นำเสนอในรูปแบบของผลิตภัณฑ์—ตัวอักษรเขียนหวัดแบบมีเชิงที่กระซิบเบาๆ บนพื้นหลังสีฟ้าทันสมัย