顏色
Last updated
Last updated
Mindtrix color 區分為五大色系：Primary、Secondary、Basic、Notice。我們將顏色劃分為9種程度並使用RGB、Hex色碼顯示，方便設計師和工程師開發上溝通。
Mindtrix 在色彩上採用PANTONE 2022長春花藍的色調，切分為9種色階，長春花籃具有藍色和紫紅色系結合，象徵實體與虛擬生活也以新的方式融合。它擴展你對生活的定義，迎向充滿活力的web3世界，探索與創造新的可能性。Mindtrix認為這樣概念與我們的產品精神相符合。
次要色系我們推薦使用主色的對比色進行傳達，抓著使用者最好的目光就是利用對比來呈現。Mindtrix選擇向日葵黃色調，讓用戶在web3的產品間也能清晰的辨別與使用，提高用戶注意力。
黑灰白的色調為產品的穩定劑，能讓使用者可以舒適的閱讀，瀏覽產品資訊。
功能色對應到介面的使用狀態：網址、成功、提醒、錯誤，Mindtrix設計系統專注在提醒和錯誤的色系，因為產品要能讓用戶準確知道何時要特別警慎，遇到問題要能輕易排解，我們使用紅色調，紅色在日常生活經驗中具備提醒、錯誤的效果，在產品使用可以加深用戶印象。成功、網址等狀態會參考著主色、次要色系進行使用。
Primary #100
rgba(230, 230, 250, 1)
#E6E6FA
Primary #200
rgba(206, 207, 246, 1)
#CECFF6
Primary #300
rgba(174, 175, 229, 1)
#AEAFE5
Primary #400
rgba(142, 143, 204, 1)
#8E8FCC
Primary #500
rgba(102, 103, 171, 1)
#6667AB
Primary #600
rgba(74, 75, 147, 1)
#4A4B93
Primary #700
rgba(51, 52, 123, 1)
#33347B
Primary #800
rgba(32, 33, 99, 1)
#202163
Primary #900
rgba(19, 20, 82, 1)
#131452
Secondary #100
rgba(254, 251, 206, 1)
#FEFBCE
Secondary #200
rgba(254, 246, 158, 1)
#FEF69E
Secondary #300
rgba(254, 240, 110, 1)
#FEF06E
Secondary #400
rgba(253, 234, 74, 1)
#FDEA4A
Secondary #500
rgba(252, 224, 15, 1)
#FCE00F
Secondary #600
rgba(216, 189, 10, 1)
#D8BD0A
Secondary #700
rgba(181, 156, 7, 1)
#B59C07
Secondary #800
rgba(146, 124, 4, 1)
#927C04
Secondary #900
rgba(120, 101, 2, 1)
#786502
Basic #100
rgba(255, 255, 255, 1)
#FFFFFF
Basic #200
rgba(247, 249, 252, 1)
#F7F9FC
Basic #300
rgba(237, 241, 247, 1)
#EDF1F7
Basic #400
rgba(228, 233, 242, 1)
#E4E9F2
Basic #500
rgba(197, 206, 224, 1)
#C5CEE0
Basic #600
rgba(143, 155, 179, 1)
#8F9BB3
Basic #700
rgba(46, 58, 89, 1)
#2E3A59
Basic #800
rgba(34, 43, 69, 1)
#222B45
Basic #900
rgba(12, 12, 12, 1)
#0C0C0C
Danger #100
rgba(255, 228, 212, 1)
#FFE4D4
Danger #200
rgba(255, 195, 170, 1)
#FFC3AA
Danger #300
rgba(255, 155, 127, 1)
#FF9B7F
Danger #400
rgba(255, 116, 96, 1)
#FF7460
Danger #500
rgba(255, 53, 43, 1)
#FF352B
Danger #600
rgba(219, 31, 38, 1)
#DB1F26
Danger #700
rgba(183, 21, 41, 1)
#B71529
Danger #800
rgba(147, 13, 41, 1)
#930D29
Danger #900
rgba(122, 8, 41, 1)
#7A0829