ระบบดีไซน์โซเชียลและชุมชน
ระบบดีไซน์ที่ดึงจากโซเชียลเน็ตเวิร์ก แพลตฟอร์มชุมชน และเว็บไซต์ส่วนตัว ฟีด โปรไฟล์ อวาตาร์ และปุ่มโพสต์เป็นตัวกำหนดระบบเหล่านี้ มักมีสีแบรนด์ที่สดใสหนึ่งสีและคอมโพเนนต์มุมโค้งที่ดูเป็นมิตร
ตัวอย่าง DESIGN.md 2 รายการ ในหมวดหมู่นี้ จาก Dribbble และ Snapchat ดึงจากหน้าสาธารณะของแต่ละเว็บไซต์ ไม่ใช่แนวทางแบรนด์อย่างเป็นทางการ เพิ่งรู้จักรูปแบบนี้ใช่ไหม อ่านว่า DESIGN.md คืออะไร

Dribbble
ระบบการออกแบบของ Dribbble สร้างจากโทนกรมท่าเข้มเกือบดำ #0d0c22 คู่กับพื้นผิวสีขาวที่คมชัด และมีสีเน้นสีชมพูร้อน #ea4c89 ซึ่งเป็นเอกลักษณ์ใช้อย่างประหยัดเพื่อเน้นเนื้อหาเชิงบรรณาธิการและจุดเด่นของส่วนที่โต้ตอบได้ ระบบตัวอักษรทั้งหมดใช้ฟอนต์ Mona Sans เพียงตระกูลเดียวในทุกน้ำหนัก โดยสร้างลำดับชั้นจากน้ำหนักและขนาดเท่านั้น ภาษาเชิงรูปทรงกำหนดด้วยปุ่มทรงแคปซูล (border-radius: 1e+07px) และการ์ตมุมโค้ง (รัศมี 12px) เลย์เอาต์โปร่งโล่งบนกริดพื้นฐาน 8px และความลึกของชั้นถูกสื่อผ่านเงาเบา ๆ มากกว่าการซ้อนทับชั้นที่หนักหน่วง

Snapchat
Snapchat บนเว็บใช้ธีมสว่างที่มีคอนทราสต์สูง โดยมีสีเหลือง #FFFC00 ซึ่งเป็นสีแบรนด์อันเป็นเอกลักษณ์เป็นหลัก ร่วมกับพื้นผิวหลักสีดำเกือบสนิท #121314 และพื้นหลังหน้าเว็บสีขาวที่สะอาดตา การออกแบบจับคู่ฟอนต์ Avenir Next (หลัก) กับ Graphik (รอง) เพื่อสร้างลำดับชั้นทางตัวอักษรที่เป็นมิตรแต่มีโครงสร้างชัดเจน องค์ประกอบโต้ตอบ เช่น ปุ่ม พิลล์ และแท็ก ใช้มุมโค้งเต็มที่ (100px) ส่วนช่องกรอกข้อมูลใช้มุมโค้งเล็กน้อยที่ 5px เมนูนำทางเป็นพิลล์ลอยพร้อมเงาฟุ้งอ่อน และเนื้อหาแสดงผลผ่านการ์ดสื่อขนาดใหญ่ที่มีข้อความสีขาวซ้อนทับ ทำให้เกิดเลย์เอาต์ที่ดื่มด่ำและเน้นการแสดงตัวอย่างแอป ความหนาแน่นโดยรวมอยู่ในระดับปานกลาง มีระยะห่างที่กว้างขวางและลำดับชั้นภาพที่ชัดเจน ซึ่งเชื่อมโยงแนวทางของงานการตลาดกับแนวทางของ UI ผลิตภัณฑ์เข้าด้วยกัน
ไม่เจอเว็บไซต์ที่ต้องการใช่ไหม
วาง URL เพื่อดึง DESIGN.md จากเว็บไซต์ใดก็ได้ ได้ทั้งสี ตัวอักษร ระยะห่าง และโทเค็น พร้อมใช้กับเวิร์กโฟลว์ AI ของคุณ