Badge System — Phase 2 Preview

Visual component library for the Trek360AI badge system

Te Taiao Mastery — Matariki Starfield Preview

Te Taiao

Nature and people are not separate — begin your guardianship

Whenua
Begin journey
Wai
Begin journey
Āhuarangi
Begin journey
Koiora
Begin journey
Tangata
Begin journey

Ko au te taiao, ko te taiao ko au

BadgeIcon — Tiers (48px)

NESW
bronze
NESW
silver
NESW
gold
NESW
platinum
NESW
legendary
NESW
Locked
NESW
65%

BadgeIcon — Categories

NESW
explorer
NESW
eco
fishing
safety
creator
community
NESW
events
NESW
routes

BadgeMini — Compact (28px)

BadgeProgressRing

0%
25%
50%
75%
100%

BadgeCard — Unlocked / Progress / Locked

NESW

Trail Beginner

Bronze

Complete your first trail

Earned
NESW

Trail Explorer

Silver

Complete 5 trails

40%
NESW

Trail Master

Gold

Complete 25 trails

72%
NESW

Trail Legend

Platinum

Complete 50 trails

Dormant
NESW

Trail Centurion

Legendary

Complete 100 trails

Dormant
NESW

Wildlife Spotter

Bronze

Spot 5 animals

Earned

Photography Pro

Gold

Upload 100 adventure photos

88%

Week Warrior

Silver

7-day activity streak

Earned

BadgeTooltip — Hover the badges

NESW
NESW
NESW

Mobile Size Reference

24px
28px
32px
NESW
40px
NESW
48px
NESW
64px

Dark Mode QA

BadgeMini — Dark

BadgeIcon — Dark

NESW
bronze
NESW
silver
NESW
gold
NESW
platinum
NESW
legendary
NESW
Locked
NESW
65%

BadgeProgressRing — Dark

0%
25%
50%
75%
100%

BadgeCard — Dark

NESW

Trail Beginner

Bronze

Complete your first trail

Earned
NESW

Trail Explorer

Silver

Complete 5 trails

40%
NESW

Trail Master

Gold

Complete 25 trails

72%
NESW

Trail Legend

Platinum

Complete 50 trails

Dormant

BadgeTooltip — Dark (hover)

NESW
NESW
NESW