Colors

Color at Qpoint is functional, not decorative. Every application communicates structure, state, or hierarchy.

Grape

Primary brand color. CTAs, interactive states, focus rings, brand moments.

#F9F7FF

100

#EFEBFC

150

#E5DAFF

200

#D7CAFE

300

#BBA5FF

400

#AB86F6

500

#895AE8

600

#7742E2

700

#5E29CC

800

#45199E

850

#32146E

900

#270B5E

Leaf

Positive signal. Success states, completion, approved actions only.

300

#58E392

400

#49CF81

500

#34BC6D

600

#1B974F

Grey

Neutral. Text, backgrounds, borders, dividers.

#FAFAFA

100

#F5F5F5

150

#F0F0F0

200

#E8E8E8

300

#D4D4D4

350

#AAAAAA

400

#949494

500

#7A7B7C

600

#565454

700

#393939

800

#2B2A2A

900

#111111

Semantic

Functional colors for system states. Placeholders — to be refined.

Error

#EF4444

Warning

#F59E0B

Success

#58E392

Info

#D7CAFE

Rules

Grape is the action color: buttons, links, interactive states.
Leaf is positive only. Never use it for errors or warnings.
Grey-900 (#111111) is primary text. Grey-600 (#565454) is secondary text.
Light surfaces: Grey-50/100. Dark surfaces: Grey-800/900.
If the reason a color is there isn't clear, it doesn't belong.