צבעים שעובדים ביחד.

Hero · הצבע הראשי מזוהה עם המותג ומוביל כותרות ואזורים מרכזיים. כ־30% מהעיצוב.

Accent · צבע הדגשה מושך את העין לכפתורים, פעולות ופרטים חשובים. כ־10% מהעיצוב.

Neutral · צבע ניטרלי הבסיס לרקעים, משטחים וטקסט, כדי לתת מקום לצבעים האחרים. כ־60% מהעיצוב.

היחס הוא המלצה בין קבוצות התפקידים. אפשר לשייך כמה צבעים לכל תפקיד.