Brand
Guide 2026

Colors, type, illustrations, and the Copilot visual system. Everything marketing needs to represent Chameleon consistently.

We own the greenLime is the signalTASA Explorer BoldForest · #244630Adapt · Signal · Grow#9BC23EWe own the greenLime is the signalTASA Explorer BoldForest · #244630Adapt · Signal · Grow#9BC23EWe own the greenLime is the signalTASA Explorer BoldForest · #244630Adapt · Signal · Grow#9BC23EWe own the greenLime is the signalTASA Explorer BoldForest · #244630Adapt · Signal · Grow#9BC23EWe own the greenLime is the signalTASA Explorer BoldForest · #244630Adapt · Signal · Grow#9BC23E

Colors

The palette

Click any swatch to copy its hex. Lime is always the most visually prominent color on any surface.

Lime — Brand primary

50
#F3F9E6
CTA
100
#EAF6D0
200
#D8EFA4
300
#C5E47A
400
#B5D45E
★
500
#9BC23E
600
#7A9C2E
AA
700
#4D821C
800
#2E5A12
900
#1A3A08

Slate — Green-tinted neutral

50
#F7FAF8
100
#F0F5F1
200
#D4E0D6
300
#AEBFB0
400
#7A8E7C
500
#526058
600
#3A4840
700
#2E3A32
800
#263028
900
#1A2020
Forest
#244630
Marketing surface
Forest Deep
#1A3322
Cards on dark
Grove
#0D2114
Deepest — hero only
Mist
#DEEDE4
Text on dark

Ocean Teal — Info

50
#EEF9FC
100
#D7F1F9
200
#A5E1F3
300
#5BCAEC
400
#17A7D3
★
500
#0F6E8C
600
#0A5166
700
#063746
800
#04252F
900
#02161C

Amber — Warning

50
#FFF9ED
100
#FFF0D6
200
#FDDCA8
300
#FDC878
400
#FCB449
★
500
#D4872A
600
#A8651A
700
#7A4510
800
#4D2808
900
#261404

Red — Danger

50
#FFE8E8
100
#FFD0D0
200
#FFA5A5
300
#FF7A7A
400
#E85050
★
500
#C94040
600
#9E2F2F
700
#7A2020
800
#521414
900
#2A0A0A

Violet — Copilot / Prism

50
#F0EFFE
100
#E2DFFE
200
#C4BFFC
300
#A79FF9
400
#8B7FF6
★
500
#6C63FF
600
#5549D4
700
#4038A8
800
#2A267C
900
#151350

Rose — Copilot / Ranger

50
#FEF0F5
100
#FDE2EC
200
#FAC4D8
300
#F7A0C0
400
#F278A4
★
500
#E0629E
600
#C04882
700
#9A3068
800
#741C4E
900
#4E0C34

Icons

Phosphor.
Regular + Duotone.

We use the Phosphor icon library at 20px. Regular for most UI, Duotone for navigation and buttons where an icon needs to stand out.

Gear
Bell
Chat
Star
Search
User
Browse the full library
Size pre-set to 20px to match our spec.
Open Phosphor Icons ↗

In-app experiences

Experience
type icons.

One icon per experience type. Default and Duotone, same as the system icons.

Automations
SVG
SVG·duo
Demos
SVG
SVG·duo
Embeddables
SVG
SVG·duo
Helpbar
SVG
SVG·duo
Launchers
SVG
SVG·duo
Microsurveys
SVG
SVG·duo
Tours
SVG
SVG·duo
Tooltips
SVG
SVG·duo

Typography

Two fonts.
Two jobs.

TASA Explorer owns every headline and display moment. Instrument Sans handles everything else.

Display · Headlines · Stats

Your product already knows what users need.

TASA Explorer · Bold · -4% tracking · 90% line height

UI · Body · Labels · Buttons

Ship tours, surveys, and tooltips that trigger on real product signals — built by your team, not engineering.
H1Heading one
H2Heading two
H3Heading three

Instrument Sans · SemiBold for headings · Regular for body

Illustrations

Texture library

Pick what fits the moment. Download and use.

↓
↓
↓
↓
↓
↓
↓
↓
↓
↓
↓
↓

Signature technique

ADAPT.

Texture bleeds through the display letterforms. 64px minimum.

Headlines in action

Three surfaces.
One voice.

Same font, same weight — different background. Each treatment serves a specific context.

Your product already knows what users need.
Forest · Mist text · Lime period — General use
bg #244630 · text #DEEDE4 · accent #9BC23E

Product adoption

Your product already knows what users need.
Grove · Texture clip ★ — Hero moments, campaign launchesbg #0D2114 · text texture-clip · min 64px
Your product already knows what users need.
Lime 50 background · Forest text — Light contexts, email, blogbg #F3F9E6 · text #244630 · accent #9BC23E

Copilot

The AI layer.

One gradient. Used only when Copilot is active. Never decorative.

Copilot icon
SVG PNG

Additional icons

Fill
SVG
Stroke
SVG

The gradient

linear-gradient(90deg,
  #9BC23E 0%, #17A7D3 25%,
  #6C63FF 50%, #E0629E 75%,
  #D4872A 100%
)
Rule: The Copilot gradient appears only when Copilot technology is active in that element. Compass = Teal · Prism = Violet · Ranger = Rose. The full gradient represents Copilot as the orchestrator of all agents.

Agents

Meet the team.

Each agent has one color and one icon. Consistency is what makes them feel like a system.

Badge
SVG
Icon
SVG
Prism
50
100
200
300
400 ★
500
600
700
800
900
Badge
SVG
Icon
SVG
Compass
50
100
200
300
400
500 ★
600
700
800
900
Badge
SVG
Icon
SVG
Ranger
50
100
200
300
400
500 ★
600
700
800
900