Caldera

จานสี

ยี่ห้อ

• Ember #fc5000 — ปุ่มควบคุมหลัก การ์ดแสดงสถิติ และองค์ประกอบภาพสำคัญต่างๆ เป็นส่วนที่ใช้สีฉูดฉาดที่สุด ความเข้มของสีตัดกับโทนสีเทาอบอุ่นสร้างความรู้สึกเร่งด่วนโดยไม่จำเป็นต้องมีองค์ประกอบตกแต่งเพิ่มเติม
• Plasma Violet #524ae9 — ฐานไล่ระดับสีฮาล์ฟโทนหลัก พื้นผิวการ์ดเพิ่มเติมอีกหนึ่งแผ่น - ใช้เกือบเฉพาะในรูปแบบจุดหลักและบนการ์ดเฉพาะแผ่นหนึ่งเท่านั้น ไม่เคยใช้สำหรับส่วนควบคุม

เป็นกลาง

• Sulfur #f5f28e — พื้นหลังของไอคอนแท็กและหมวดหมู่ ซึ่งเป็นไฮไลต์ขนาดเล็ก เป็นสีเหลืองอ่อนที่ใช้เพื่อระบุหมวดหมู่ของบทความในบล็อกและประกาศเกี่ยวกับโครงการต่างๆ
• Limestone #f7f6f2 — พื้นผิวของการ์ด พื้นหลังของบล็อกเนื้อหา และการเติมสีเพิ่มเติมของปุ่มต่างๆ ใช้สีขาวโทนอ่อนและอบอุ่นกว่า ทำให้องค์ประกอบเหล่านั้นโดดเด่นขึ้นจากพื้นหลังของหน้าเว็บ
• Pumice #e2e2df — พื้นหลังหลักของหน้ากระดาษเป็นสีเทาโทนอบอุ่นปานกลาง ซึ่งทำหน้าที่เป็นพื้นฐานสำหรับแต่ละส่วน โดยมีสีเข้มกว่าพื้นผิวของกระดาษแข็งเล็กน้อย ทำให้สามารถแยกภาพและพื้นหลังออกจากกันได้อย่างแนบเนียนโดยไม่มีเงา
• Obsidian #070607 — ข้อความหลัก หัวข้อ ข้อความลิงก์ และกรอบปุ่มมีสีดำเกือบทั้งหมด โดยมีสีโทนอบอุ่นจางๆ ที่แทบมองไม่เห็น ซึ่งเข้ากันกับสีโทนอบอุ่นของพื้นหลัง
• Chalk #ffffff — ข้อความในส่วนสีเข้ม ข้อความที่ป้อนบนพื้นหลังสีเข้ม การซ้อนทับที่มีความคมชัดสูง - สีขาวบริสุทธิ์จะใช้เฉพาะในกรณีที่ต้องการความคมชัดสูงสุดกับพื้นผิวสีเข้มเท่านั้น

การจัดพิมพ์

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

• PP Neue Corp Compact — ทดแทน: Bebas Neue · โครงร่าง 400 (Ultrabold cut) · หัวข้อและข้อความแสดงผลทั้งหมด ใช้แบบอักษรที่ออกแบบมาเป็นพิเศษ มีลักษณะแคบและหนาเป็นพิเศษ ทำให้หัวข้อดูแข็งแกร่งและหนักแน่นเหมือนป้ายโฆษณา ขนาด 189 พิกเซลในบล็อกหลักสะท้อนถึงสไตล์ที่เป็นเอกลักษณ์ของแบรนด์ คือ แคบ กระชับ ดูเหมือนโครงสร้างมากกว่าการจัดวางตัวอักษร การตั้งค่า "ss06" และ "ss10" จะเปิดใช้งานรูปแบบตัวอักษรและระยะห่างที่แตกต่างกัน เพื่อให้ได้จังหวะที่กระชับและดุดันยิ่งขึ้น ระยะห่างระหว่างตัวอักษรที่เป็นบวก (+0.02em) นั้นไม่ธรรมดาสำหรับขนาดการแสดงผล และช่วยป้องกันความรู้สึกว่าข้อความดูคับแคบในขนาด 80–189 พิกเซล
• DM Sans — ทดแทน: Inter · โครงร่าง 500 (Medium only — never Regular or Bold) · ข้อความหลัก ลิงก์นำทาง ป้ายกำกับปุ่ม และหัวข้อรองมีความกว้างไม่เกิน 30 พิกเซล เลือกใช้แบบอักษรขนาดกลางโดยตั้งใจ เพราะแบบอักษรปกติจะดูบางเกินไปเมื่อเทียบกับแบบอักษรตัวหนาพิเศษสำหรับหัวข้อ และแบบอักษรตัวหนาจะแย่งความโดดเด่นไป แบบอักษร DM Sans สร้างความสมดุลที่ดูเป็นธรรมชาติและมีความเป็นเรขาคณิตเล็กน้อยให้กับแบบอักษรหัวข้อที่ดูเป็นแบบอุตสาหกรรม
• System sans-serif — ทดแทน: Inter · โครงร่าง 400 · คำบรรยายภาพ เมตาเท็กซ์ วันที่ ไมโครแท็ก ใช้เฉพาะในขนาดไฟล์ 12 พิกเซล ซึ่งน้ำหนักและการจดจำแบรนด์มีความสำคัญน้อยกว่าการประหยัดขนาดไฟล์

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

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

• teenage engineering — แคตตาล็อกสินค้าอุตสาหกรรมด้านไฟสตูดิโอ - ตัวผลิตภัณฑ์เป็นสิ่งเดียวที่มีความสำคัญบนหน้าเว็บ ส่วนสิ่งอื่นๆ นั้นถูกกล่าวถึงโดยรอบ
• basement — เครื่องพิมพ์ว่างเปล่าเวลาตี 3 – ตัวอักษรขนาดใหญ่บีบอัดกระจายอยู่บนพื้นหลังสีดำสนิท มีเพียงแสงสีส้มริบหรี่บนแถบนำทาง ทุกสิ่งทุกอย่างรอบข้างเป็นสีขาวหรือสีเทาจางๆ
• amra — ทรงกลมสีรุ้งบนพื้นหลังสีขาว—สีม่วงลาเวนเดอร์เป็นสีเดียวที่โดดเด่นบนหน้ากระดาษที่แทบจะไร้สีสัน และทรงกลมไล่ระดับสีเพียงลูกเดียวนี้ทำหน้าที่แทนภาพประกอบหลักได้อย่างสมบูรณ์
• Stink Studios — สตูดิโอถ่ายทำภาพยนตร์ยามเที่ยงคืน - เสียงเครื่องฉายดังหึ่งๆ ห้องมืดสนิท มีเพียงฟิล์มเท่านั้นที่ส่องสว่าง
• Andrei Rybin — สมุดสเก็ตช์ขาวดำเป็นสมุดออกแบบที่นำหน้าจอโทรศัพท์มาติดไว้บนผนังสีขาวคล้ายกับแผ่นภาพตัวอย่าง
• Uniswap Cup — การถ่ายทอดสดการแข่งขันอีสปอร์ตเกิดขึ้นบนเว็บไซต์จำลอง โดยมีเครื่องหมายสีชมพูวาดเป็นตารางสี่เหลี่ยมสีขาวและเส้นบางๆ
• Freytag Anderson — ม่านโรงภาพยนตร์เปิดขึ้นพร้อมกับคำเพียงคำเดียว ภาพเคลื่อนไหวขนาดใหญ่กินพื้นที่ทั้งจอ ชื่อแบรนด์ปรากฏอยู่ที่มุมจอเหมือนเครดิต และไม่มีสิ่งใดมาดึงดูดความสนใจอีกเลย
• Integrated Biosciences — ห้องปฏิบัติการเรืองแสงชีวภาพตอนเที่ยงคืน
• Vercel — พิมพ์เทอร์มินัลลงบนกระดาษสีขาว
• Mintlify — สวนเมฆเหนือโต๊ะกระจก ท้องฟ้าที่วาดด้วยมือและสารคดีถูกจัดวางเข้าด้วยกัน—เป็นเพียงจุดเดียวที่สีสันและแนวคิดมาบรรจบกันก่อนที่หน้ากระดาษจะจางหายไปเป็นสีขาวบริสุทธิ์
• Gleap — พื้นที่ทำงานที่ตกแต่งด้วยโทนสีครีมอบอุ่น พร้อมด้วยรายละเอียดสีเทากราไฟต์—สตูดิโอที่จุดหมึกสีดำด้านดูเหมือนจะลอยอยู่เหนือโครงสร้างผ้าลินิน
• ClickUp — หน้าแดชบอร์ดอันทรงพลังบนพื้นหลังหินอ่อนสีขาว หน้าเว็บนี้เป็นโบรชัวร์ผลิตภัณฑ์สำหรับเครื่องมือเพิ่มประสิทธิภาพการทำงาน ดังนั้นภาษาภาพจึงยืมมาจากตัวผลิตภัณฑ์เอง ได้แก่ รายการหนาแน่น ตัวบ่งชี้สถานะ กลุ่มรูปประจำตัว และข้อความตัวหนาที่ดูเหมือนข้อมูลจำเพาะของผลิตภัณฑ์ที่แสดงอยู่