🎨 Habit Huddle UI System
A simple, consistent design system: Emerald = Action, Grey = Info, Red = Danger
PRIMARY (Most Important Action):
White text + Emerald gradient + White border • Use for: Checkin, Save, Submit
SECONDARY (Standard Actions):
Emerald text + Transparent emerald BG + White border • Use for: Reply, Invite, Edit, most actions
INFO (View/Read-Only):
Grey text + Grey BG + White border • Use for: View, Details, Manage, Info
FILTER/TOGGLE (Navigation):
White text + White border • Use for: Filters, tabs, toggles with chevrons
DESTRUCTIVE (Dangerous):
Red text + Red BG + White border • Use for: Delete, Leave, Remove
✨ KEY IMPROVEMENTS:
- • ONE border color: All buttons use white/20 border (not emerald/red borders that blend in)
- • Simpler hierarchy: Primary → Secondary → Info → Filter → Destructive
- • No sky-blue: "Manage" is now grey (info) not blue
- • Consistent sizing: All use px-3 py-1.5 for regular, px-4 py-2 for large
- • Clear purpose: Each type has a specific use case
Surfacner's Daily Movement Spark
1 member
This huddle is exclusive
Sign up to request to join Surfacner's Daily Movement Spark.
Sign up
The habit you get when you join
or you can create your own
✅
Put on my workout shoes and step outside for 2 minutes
🎯
Complete 20 minutes of physical activity
best 🔥 10
This huddle is invitation-only: request to join above, or run the habit solo.
📋 The Playbook
why this habit works
❓ Checkin Question
What did you workout?
⏰ Cue / Trigger
Putting on my workout shoes
👤 Identity
I am an active person who prioritizes my physical health
🏆 Long-term Goal
Improve physical fitness and stamina
💬 Mantra
Small moves lead to big changes.
❤️ Why
I want to feel stronger, have more energy throughout the day, and improve my long-term health so I can enjoy life without physical limitations.
Tags: Fitness, Resilience, Self-Care
🏁
Season 1
day 19 of 31
ends Aug 1
No checkins yet this season. First one leads.
📅 Calendar
Cell = members checked in that day
everyone ✨
💬 Huddle Feed
Recent Checkins, replies, and applause