Vivid+Co
แสงสีรุ้งส่องผ่านหินออบซิเดียน
Vivid+Co ดำเนินงานในบรรยากาศมืดมิดราวกับภาพยนตร์: พื้นหลังสีดำสนิท (#101010–#495764) ถูกตัดด้วยสีขาวนวลเพียงสีเดียว (#fffdf9) ซึ่งใช้สำหรับแบบอักษรและองค์ประกอบอินเทอร์เฟซเกือบทั้งหมด ตัวอักษรส่วนใหญ่ใช้ Neue Montreal ที่ความหนา 400 ซึ่งเป็นการจงใจไม่ใช้ตัวหนา โดยเน้นความโดดเด่นด้วยขนาด (136px และ 105px) มากกว่าความหนา เทคนิคที่เป็นเอกลักษณ์คือปริซึมสี: บล็อกแสงสีแดง/เขียว/น้ำเงินที่อิ่มตัว แยกจากกันด้วย RGB กรองผ่านลูกบาศก์แก้ว ทำให้พื้นผิวขาวดำดูไม่น่าเบื่อ เค้าโครงจัดวางอยู่ตรงกลางและกว้างขวาง การนำทาง ข้อความ และลิงก์ทั้งหมดใช้สี #fffdf9 สีเดียว โดยไม่มีปุ่มเน้นสี การเติมสี หรือเงาแยกต่างหาก การแยกความแตกต่างทำได้โดยระยะห่าง ขนาด และเอฟเฟกต์สีรุ้งที่ทำหน้าที่เป็นสีเน้นเพียงอย่างเดียวของแบรนด์
พื้นหลังสีเข้มเต็มความกว้าง มีคอลัมน์เนื้อหาเดียว ขนาดสูงสุดประมาณ 1440 พิกเซล องค์ประกอบหลักคือรูปทรงปริซึมที่อยู่ตรงกลาง มีชื่อเรื่องซ้อนทับ (ข้อความตัดกับรูปทรงสี่เหลี่ยม) และคำบรรยายย่อยจัดชิดซ้าย การนำทางอยู่บนแถบด้านบนบางๆ ประกอบด้วยโลโก้ทางซ้าย ลิงก์ที่มองไม่เห็นสี่ลิงก์ทางขวา และปุ่ม "ติดต่อ" เฉพาะที่ท้ายแถว จังหวะของส่วนต่างๆ สลับกันระหว่างแผงฮีโร่ที่มีความสูงเต็ม และแถบเนื้อหาที่แคบกว่า โดยมีช่องว่างประมาณ 108 พิกเซล การจัดวางเนื้อหาไม่สมมาตร โดยรูปทรงปริซึมทำหน้าที่เป็นจุดศูนย์กลางของภาพ และชื่อเรื่องจะล้อมรอบ ข้อความแบบคอลัมน์เดียวมีความกว้างสูงสุดประมาณ 440 พิกเซล ไม่มีตารางหลายคอลัมน์ เมทริกซ์การ์ด และตารางราคา ส่วนท้ายเป็นแถบแคบๆ แบ่งด้วยเส้นบางๆ มีข้อมูลเมตาแบบสองคอลัมน์
องค์ประกอบการออกแบบหลักคือภาพสามมิติแบบนามธรรมของลูกบาศก์แก้วที่มีความคลาดเคลื่อนของสีที่ขอบ โดยคั่นด้วยสี RGB ไม่มีภาพถ่าย ไม่มีภาพคน ไม่มีภาพผลิตภัณฑ์ ปริซึมคือภาพลักษณ์ของแบรนด์ ส่วนที่เหลือเป็นตัวอักษรขาวดำบนพื้นหลังสีเข้ม ไอคอนมีน้อยมาก: ป้ายกำกับนำทางที่ละเอียดอ่อนและเคอร์เซอร์/สัญลักษณ์เน้นขนาดเล็ก (พื้นที่ 142765) ที่ส่วนท้ายของหัวข้อหนึ่งบ่งบอกถึงไอคอนเส้นเดียวขนาด 16 พิกเซล ไม่มีภาพประกอบ ไม่มีลวดลายตกแต่ง ไม่มีพื้นผิว
จานสี
เป็นกลาง
- Bone White
#fffdf9— ข้อความหลัก ป้ายกำกับนำทาง สีของลิงก์ และสีพื้นของหัวข้อ ล้วนเป็นสีขาวเกือบทั้งหมด โดยครอบคลุมพื้นที่การพิมพ์ทั้งหมดบนพื้นหลังสีเข้ม - Obsidian
#101010— พื้นหลังของหน้าเว็บ ซึ่งเป็นสีที่ใช้เติมให้กับเส้นหลักและเส้นแบ่งนั้น เป็นสีดำสนิท โดยมีลวดลายคล้ายปริซึมอยู่ภายใน - Graphite Veil
#495764— พื้นหลังสีเทาเข้มเย็นตาครอบคลุมส่วนหัวเรื่องและเนื้อหา ทำให้ภาพดูมีมิติโดยไม่ต้องใช้สีดำด้าน - Ash Border
#403f3f— มีการใช้เส้นแบ่งบางๆ และเส้นขอบของการ์ดที่ขนาด 1 พิกเซล เพื่อแยกบรรทัดโดยไม่ให้รบกวนข้อความ - Fog Blue
#6f879c— ข้อความรองและป้ายกำกับปุ่มที่ดูไม่เด่นชัด (อัตราส่วนความคมชัด 3.7:1) – การกำหนดหมวดหมู่บริการ เช่น “กลยุทธ์” “ความคิดสร้างสรรค์” “การสื่อสารและการตลาด” จะถูกมองว่าเป็นเมตาเดต้าที่ไม่ถูกเน้น - Pure Black
#000000— ใช้สำหรับตกแต่งไอคอนและภาพประกอบ SVG—ใช้ในภาพปริซึมและสัญลักษณ์ไอคอน ไม่ใช่พื้นหลัง
การจัดพิมพ์
จาก 15 เป็น 136 พิกเซล · 9 ขั้นตอน
- Neue Montreal — ทดแทน: Söhne · โครงร่าง 400, 700 · แบบอักษรพิเศษนี้ถูกใช้ทั่วทั้งส่วนติดต่อผู้ใช้ ไม่ว่าจะเป็นหัวข้อ เนื้อหาหลัก การนำทาง ปุ่ม ลิงก์ และส่วนท้ายของหน้าเว็บ แบบอักษรขนาด 400 เป็นค่าเริ่มต้น ส่วนแบบอักษรขนาด 700 นั้นสงวนไว้สำหรับหัวข้อย่อยเท่านั้น หัวข้อที่มีขนาด 105px และ 136px จะมีระยะห่างระหว่างบรรทัด 1.00–1.01em และระยะห่างระหว่างตัวอักษร -0.02em ทำให้เกิดหัวข้อที่ดูเหมือนภาพยนตร์ เรียงซ้อนกัน และให้ความรู้สึกเหมือนงานประติมากรรมมากกว่าการพิมพ์แบบตัวอักษรทั่วไป
ช่วงเวลาและรูปแบบ
| วัตถุประสงค์ | ความหมาย |
|---|---|
| ความหนาแน่น | กว้างขวาง |
| ขั้นตอนพื้นฐาน | 7px |
| รัศมีปุ่ม | 0px |
| รัศมีการ์ด | 15px |
| เงา | ไม่ - ใช้เส้นขอบแทนเงา |
| ระหว่างส่วนต่างๆ | 108px |
| ความกว้างของหน้า | 1440px |
AI จะสร้างเว็บไซต์ของคุณในสไตล์ของ Vivid+Co และเติมข้อมูลลงไป
- ใส่สินค้าและโพสต์ผ่านลิงก์ - Instagram, TikTok, Facebook
- ย้ายเนื้อหาจากเว็บไซต์เก่าของคุณ—เพียงระบุที่อยู่เว็บไซต์
- ดีไซน์ทันสมัยบนเอนจิ้นที่ดีที่สุด: React ( Next.js) พร้อมการเรนเดอร์ฝั่งเซิร์ฟเวอร์และการเพิ่มประสิทธิภาพ SEO ในตัว
- การเพิ่มประสิทธิภาพ SEO แบบอัตโนมัติเต็มรูปแบบสำหรับผลการค้นหาและคำแนะนำจากโครงข่ายประสาทเทียม
สไตล์ที่คล้ายกัน
- Sequel — การฉายภาพยนตร์ส่วนตัวหลังพระอาทิตย์ตกดินเป็นแสงสว่างอบอุ่นเพียงหนึ่งเดียวในโรงภาพยนตร์ที่มืดมิด
- ThoughtLab — อนุสาวรีย์หินออบซิเดียนที่มีสัญลักษณ์สีแดงเข้ม พื้นที่ว่างเปล่าสีดำสนิท ที่ซึ่งวัตถุสีแดงสดเพียงชิ้นเดียวในมหาวิหาร คือรูปทรงสีเดียวที่พิมพ์ด้วยตัวอักษรสีขาวขนาดใหญ่
- Dovetail — แบบแปลนภายใต้แสงจันทร์สีดำ—เส้นกราฟแทบมองไม่เห็น ตัวอักษรสีขาว และประกายสีม่วงหนึ่งดวง
- MekaVerse — แกลเลอรี่ภาพขาวดำของสิ่งประดิษฐ์ดิจิทัล—พื้นที่ว่างสีดำสนิทที่โลกที่ถูกสร้างขึ้นแขวนอยู่ราวกับนิทรรศการในพิพิธภัณฑ์ และส่วนติดต่อผู้ใช้ทั้งหมดเป็นหมึกสีขาวบนกระจกสีดำด้าน
- Krea — แกลเลอรีนัวร์ตอนเที่ยงคืน
- Factory — เครื่องเทอร์มินัลใน "ห้องบัญชาการ" ตอนเที่ยงคืน "โรงงาน" คือแผงควบคุมสีดำสนิทที่มีการ์ดสีขาวใบเดียววางลงราวกับคำสั่งที่ส่องด้วยไฟฉาย สิ่งเดียวที่มีอยู่ในห้องนั้นคืองานนั่นเอง
- basement — เครื่องพิมพ์ว่างเปล่าเวลาตี 3 – ตัวอักษรขนาดใหญ่บีบอัดกระจายอยู่บนพื้นหลังสีดำสนิท มีเพียงแสงสีส้มริบหรี่บนแถบนำทาง ทุกสิ่งทุกอย่างรอบข้างเป็นสีขาวหรือสีเทาจางๆ
- Stink Studios — สตูดิโอถ่ายทำภาพยนตร์ยามเที่ยงคืน - เสียงเครื่องฉายดังหึ่งๆ ห้องมืดสนิท มีเพียงฟิล์มเท่านั้นที่ส่องสว่าง
- Apple (España) — โรงละครสีดำที่มีอุปกรณ์ให้แสงสว่าง
- Charlie — ตัวอักษรที่แกะสลักจากหินอารามลงบนหินออบซิเดียน แฟ้มสะสมผลงานที่ผนังสีแดงเพียงด้านเดียวสร้างความเงียบงันที่น่าตกใจ
- Rive — ระบบมองเห็นในที่มืดความแม่นยำสูง อินเทอร์เฟซมีเลนส์พิเศษที่สามารถมองทะลุความมืดเพื่อโฟกัสรายละเอียดทางเทคนิคได้อย่างคมชัดที่สุด
- Datalands — โบสถ์สีดำที่มีแสงนีออนกะพริบเพียงดวงเดียว โลโก้กินพื้นที่เต็มโถงกลาง ส่วนข้อความอื่นๆ เป็นเพียงตัวอักษรที่แทบจะไม่ได้ยินอยู่ด้านล่าง