Skill: Design Button Hierarchy

Purpose

Create clear distinctions between primary, secondary, and tertiary actions so users know which action to take.

Type

Generative + Evaluative

Input

• List of actions/buttons needed
• Relative importance of each action (primary, secondary, tertiary)
• Context (form, modal, page, toolbar)

Output

• Button style specifications for each level
• Pass/Fail assessment of existing button hierarchy

Transformation Performed

Maps action importance to visual treatment: primary = filled brand color, secondary = outline or subtle (including grey solid), tertiary = text-only or link style.