Slash
ห้องนิรภัยเที่ยงคืนพร้อมสมุดบัญชีปิดทอง
Slash ทำงานในโหมดแกลเลอรี่กลางคืน: พื้นหลังเกือบดำ ตัวอักษรสีขาว และเน้นด้วยสีทองแดงอบอุ่นเพียงจุดเดียวเพื่อเป็นเครื่องหมายวรรคตอน หัวข้อข่าวแสดงด้วย Ivy Presto ซึ่งเป็นแบบอักษร didone serif ที่มีความคมชัดสูงและใช้ในขนาดที่ใหญ่มาก (สูงสุด 88 พิกเซล) การผสมผสานระหว่างแบบอักษร serif และ sans-serif นี้เป็นเอกลักษณ์ของระบบ ทำให้ดูน่าเชื่อถือในด้านการเงินโดยไม่ดูเคร่งขรึมแบบธนาคารทั่วไป อินเทอร์เฟซผู้ใช้ส่วนที่เหลือได้รับการออกแบบให้เรียบง่ายอย่างจงใจ: ขอบบาง ปุ่มควบคุมรูปทรงแคปซูล ข้อความขนาดกะทัดรัด 16 พิกเซล และการยกขึ้นเล็กน้อยเพื่อให้ตัวอักษรดูโปร่งสบาย การไล่ระดับสีทองเพียงจุดเดียว (เส้นกราฟ การเน้นขนาดเล็ก) เพิ่มความอบอุ่นให้กับระบบขาวดำ ทำให้รู้สึกเหมือนแสงอบอุ่นของเทอร์มินัล Bloomberg ที่สร้างขึ้นสำหรับกลุ่มนักออกแบบ
เนื้อหามีความกว้าง 1216 พิกเซล จัดกึ่งกลาง และมีช่องว่างแนวตั้ง 160 พิกเซล หน้าแรกเป็นภาพพื้นหลังสีเข้มเต็มความกว้าง แบ่งเป็นสองส่วน: ส่วนหัวแบบมีเชิง (serif) จัดชิดซ้าย (กว้าง 64–88 พิกเซล) พร้อมช่องสำหรับใส่ที่อยู่อีเมลอยู่ด้านล่าง และการ์ด UI ผลิตภัณฑ์ขนาดใหญ่ (ภาพหน้าจอแดชบอร์ด) อยู่ทางด้านขวาที่ความกว้าง 50% ส่วนถัดไปใช้ส่วนหัวแบบคอลัมน์เดียว จัดกึ่งกลาง (แบบมีเชิง กว้าง 44–64 พิกเซล) พร้อมหัวข้อย่อยในรูปแบบ Inter ตามด้วยตารางสามคอลัมน์สำหรับคำอธิบายคุณสมบัติ/คำรับรอง/บล็อก การนำทางเป็นแถบด้านบนคงที่: โลโก้ทางด้านซ้าย เมนูตรงกลาง (บริษัท ผลิตภัณฑ์ โซลูชัน ลูกค้า ราคา คำถามที่พบบ่อย) การเข้าสู่ระบบจัดชิดขวา (ไม่เด่นชัด) และการเริ่มต้นใช้งาน (องค์ประกอบสีขาว) ส่วนท้ายมีตารางห้าคอลัมน์หนาแน่นประกอบด้วยลิงก์พร้อมข้อมูลบริษัทและข้อกำหนดทางกฎหมาย หน้าเว็บจะสลับระหว่างส่วนตารางที่มีเนื้อหามากมายและสถิติแบบเต็มหน้าจอ โดยจังหวะการแสดงผลจะกำหนดด้วยพื้นที่ว่างสีขาวที่กว้างขวางระหว่างคอลัมน์ แทนที่จะใช้สีพื้นหลังที่สลับกัน (ทั้งหน้าเว็บถูกนำเสนอเป็นผืนผ้าใบเดียวที่รวมเป็นหนึ่งเดียว)
ภาพถ่ายเป็นแบบนิตยสารและเป็นธรรมชาติ: ภาพบุคคลอบอุ่นของผู้ก่อตั้งและสมาชิกในทีมในสภาพแวดล้อมการทำงานจริง (สำนักงาน ห้องนั่งเล่น สถานที่ก่อสร้าง) ภาพจะเต็มกรอบการ์ดโดยไม่มีช่องว่าง มีการใช้การไล่ระดับสีเข้มที่ด้านล่างของการ์ดคำรับรองเพื่อเพิ่มความชัดเจนในการอ่านข้อความ สุนทรียภาพ—"LinkedIn ผสมผสานกับนิตยสาร"—ดูสบายๆ เป็นธรรมชาติ และดูเรียบง่าย ไม่ใช่ภาพถ่ายสต็อกที่ดูขัดเกลา ภาพขนาดย่อของบทความผสมผสานภาพถ่ายกับภาพประกอบ (คนยืนอยู่ในเขาวงกต เตาผิงที่มีถุงเงิน) ส่วนติดต่อผู้ใช้ของผลิตภัณฑ์แสดงในโหมดมืดที่มีความโปร่งใสเต็มที่ ลอยอยู่เหนือหน้าเว็บบนพื้นผิวสีเข้มที่ดูเรียบง่าย—ซึ่งเป็นองค์ประกอบหลัก ไอคอนเป็นแบบขาวดำ มีเส้นขอบ 1 พิกเซล ในสี #2e3038 หรือ #777a88 ไม่มีการเติมสีของแบรนด์
จานสี
เป็นกลาง
- Bone
#e2e3e9— ใช้ขนาดตัวอักษรขนาดใหญ่สำหรับข้อความหลัก ป้ายกำกับข้อมูลโดยละเอียด และโทนสีข้อความมาตรฐานในองค์ประกอบ UI ส่วนใหญ่ - Obsidian
#08080a— พื้นหลังของหน้าเว็บและส่วนท้ายหน้าเว็บ รวมถึงพื้นผิวที่มืดที่สุดนั้นเกือบจะเป็นสีดำสนิทโดยมีสีฟ้าเจืออยู่เล็กน้อย - Onyx
#040406— พื้นผิวของการ์ด ซึ่งเป็นพื้นหลังเพิ่มเติม มีความลึกกว่าหน้ากระดาษหนึ่งระดับ เพื่อสร้างเอฟเฟ็กต์ภาพ - Carbon
#121317— แผงยกสูง การเติม UI ที่ไม่รบกวนสายตา - ก้าวแรกที่เห็นได้ชัดว่าเบาลงในวิวัฒนาการของ Surface Stack - Graphite
#1c1d22— เส้นขอบ เส้นแบ่ง ช่องสำหรับไอคอน แถบเลื่อนควบคุม—เฉดสีที่ละเอียดอ่อนที่สุดที่กำหนดโครงสร้าง - Slate
#2e3038— เพิ่มเส้นขอบเพิ่มเติม เส้นไอคอนที่ดูนุ่มนวล และเส้นแบ่งที่ไม่ฉูดฉาดระหว่างบล็อกเนื้อหา
การจัดพิมพ์
จาก 13 เป็น 88 พิกเซล · 9 ขั้นตอน
- Ivy Presto — ทดแทน: Playfair Display · โครงร่าง 400, 500 · แบบอักษรมีเชิงสำหรับหัวข้อและหัวข้อย่อย—ใช้เฉพาะสำหรับหัวข้อและชื่อส่วนที่มีขนาด 28 พิกเซลขึ้นไป เส้นขีดแบบ didone ที่มีความคมชัดสูงพร้อมเชิงบาง ๆ สร้างความรู้สึกหรูหราแบบงานบรรณาธิการ ระยะห่างระหว่างตัวอักษรที่เล็กเพียง 0.01 ไมโครเมตรนั้นไม่ธรรมดาและทำให้แบบอักษรดูเหมือนงานพิมพ์หรือแบบบัญชี แบบอักษรมีเชิงนี้เป็นหัวใจสำคัญของแบรนด์—มันทำให้ Slash แตกต่างจากบริษัทฟินเทค SaaS อื่น ๆ ที่มักใช้แบบอักษรไม่มีเชิงแบบเรขาคณิตเป็นค่าเริ่มต้น
- Inter — ทดแทน: Inter (self-hosted via Google Fonts) · โครงร่าง 300, 400, 500, 600, 700 · UI Sans—ใช้สำหรับข้อความหลัก การนำทาง ปุ่ม ป้ายกำกับ ลิงก์ ช่องกรอกข้อมูล และหัวข้อย่อย ข้อความหลักใช้ฟอนต์ขนาด 300 สำหรับข้อความรองที่ไม่เด่นชัด ฟอนต์ขนาด 500 ใช้สำหรับข้อความที่ต้องการเน้นปานกลางและป้ายกำกับปุ่ม และฟอนต์ขนาด 600 สงวนไว้สำหรับป้ายกำกับหมวดหมู่ที่เขียนด้วยตัวพิมพ์เล็ก ระยะห่างระหว่างตัวอักษรจะลดลงจาก 2 (-3) และลดลงเมื่อขนาดตัวอักษรลดลง ซึ่งเป็นลักษณะเฉพาะของการปรับขนาดทางสายตาของฟอนต์ Inter
ช่วงเวลาและรูปแบบ
| วัตถุประสงค์ | ความหมาย |
|---|---|
| ความหนาแน่น | กว้างขวาง |
| ขั้นตอนพื้นฐาน | 8px |
| รัศมีปุ่ม | 9999px |
| รัศมีการ์ด | 10px |
| เงา | ไม่ - ใช้เส้นขอบแทนเงา |
| ระหว่างส่วนต่างๆ | 160px |
| ความกว้างของหน้า | 1216px |
AI จะสร้างเว็บไซต์ของคุณในสไตล์ของ Slash และเติมข้อมูลลงไป
- ใส่สินค้าและโพสต์ผ่านลิงก์ - Instagram, TikTok, Facebook
- ย้ายเนื้อหาจากเว็บไซต์เก่าของคุณ—เพียงระบุที่อยู่เว็บไซต์
- ดีไซน์ทันสมัยบนเอนจิ้นที่ดีที่สุด: React ( Next.js) พร้อมการเรนเดอร์ฝั่งเซิร์ฟเวอร์และการเพิ่มประสิทธิภาพ SEO ในตัว
- การเพิ่มประสิทธิภาพ SEO แบบอัตโนมัติเต็มรูปแบบสำหรับผลการค้นหาและคำแนะนำจากโครงข่ายประสาทเทียม
สไตล์ที่คล้ายกัน
- Modal — เทอร์มินัลเรืองแสงในห้องเซิร์ฟเวอร์ที่มืดมิด - แหล่งกำเนิดแสงเพียงแหล่งเดียวคือแสงสีเขียวสดใส
- AgentQL — แสงเหนือเหนืออาคารผู้โดยสารในเวลากลางคืน
- GitHub — แผงควบคุมอวกาศที่มีจุดควบคุมเรืองแสงชีวภาพ—พื้นที่ทำงานที่มืดมิดและสร้างบรรยากาศ โดยมีแสงสีเขียวเพียงจุดเดียวชี้บอกทิศทางไปข้างหน้า
- Doppler — แสงสีม่วงส่องสว่างภายในห้องนิรภัยยามเที่ยงคืน พื้นผิวสีดำสนิทเรืองรองด้วยสัญญาณสีลาเวนเดอร์เพียงดวงเดียวและแสงสีเขียวเพื่อยืนยัน ทุกพื้นผิวโค้งมนพอที่จะจับต้องได้
- Basedash — เทอร์มินัลข้อมูลยามเที่ยงคืนพร้อมตัวอักษรแบบด้าน หอดูดาวมืดมิดที่ซึ่งตัวชี้วัดเรืองแสงสีม่วงและสีเขียว หัวข้อแบบมีเชิงลอยอยู่เหนือเสียงรบกวน และปุ่มสีขาวรูปทรงแคปซูลเป็นสิ่งเดียวที่สว่างไสวในห้องที่มีพื้นผิวสีดำนุ่มนวล
- Superwhisper — แสงเหนือจางหายไปเหนือกระจกยามเที่ยงคืน
- Better Stack — คอนโซล SRE เที่ยงคืน
- Langbase — คอนโซล Midnight Northern Lights
- Astro — ศูนย์ควบคุมภารกิจห้วงอวกาศลึก พร้อมแสงสีม่วงเรืองรองเพียงดวงเดียวจากเนบิวลา
- Wayfinder — หน้าจอภาพยนตร์สีดำที่มีชื่อเรื่องปรากฏอยู่เหนือภาพประกอบที่เคลื่อนไหวได้ โดยแทบไม่ได้ยินเสียง ส่วนติดต่อผู้ใช้เป็นแบบแถบเลื่อนปรับความสว่าง แทนที่จะเป็นแผงควบคุม
- HashiCorp — ห้องควบคุมในยามเที่ยงคืนที่ส่องสว่างด้วยแสงนีออนสีม่วง เป็นพื้นผิวทางเทคนิคที่มืดมิด โดยมีลูกบาศก์หกเหลี่ยมเรืองแสงเป็นจุดอ้างอิงสีเพียงอย่างเดียว
- Umbrel — เตาผิงอบอุ่นในห้องเซิร์ฟเวอร์กลางคืน—ห้องมืดที่แสงสีพีชอ่อนๆ ส่องสว่างเน้นสิ่งที่สำคัญอย่างแท้จริง