Internal reference

GlycoBay Living design system

The building blocks that keep the brand consistent as it grows — colors, type, components, mascot & merch usage, motion, voice, and the claim-safety rules we never break.

Color

Bay green

--green-800

--green-600

--green-400

--green-100

Clay

--clay-600

--clay-400

--clay-200

--clay-100

Bay blue

--blue-600

--blue-500

--blue-300

--blue-100

Amber

--amber-600

--amber-500

--amber-300

--amber-100

Paper & ink

--cream

--sand-200

--ink-700

--ink-900

Typography

Display / h1Steady energy, real food.

Heading / h2Steady energy, real food.

Subhead / h3Steady energy, real food.

BodySteady energy, real food.

Small / captionSteady energy, real food.

This is the signature spaced-caps eyebrow

Buttons

Badges, tags & Steady Score

GreenClayBlueAmberSolidFilter tagActive tag

“Steady fit” = product-match indicator, never a health score.

Form fields

Text inputSelectTextarea

Cards

Best seller

Core system

The Steady Plate Toolkit

The whole system in one place — build any steady plate without a recipe.

Pip pick · Anyone who wants the full system

$34

View

Mascot usage — Pip

Pip the avocado mascot cooking with a spoon and pot

cooking · idle

Pip the avocado mascot giving a thumbs up

thumbsup · happy

reading · curious

celebrating · success

Pip is the emotional center — warm, never clinical. Use idle breathing everywhere; reserve success/sparkles for wins (quiz results, saved plates). Always respects prefers-reduced-motion.

Mascot animation — PipAnimation (frame-by-frame)

Preloaded PNG frames crossfade with a gentle bob; celebration adds a soft scale-bounce. Controlled via state, interactive (hover = idea, tap = celebrate), or an imperative ref. See docs/PIP_ANIMATION.md.

state="thinking"

state="idea"

state="celebration"

interactive

Drive it from JS via the ref:

Motion principles

Calm easing (ease-out), no aggressive bounce. Reveals rise + fade over ~0.7s.
Pip breathes, floats drift, steam rises — subtle and looping, never distracting.
Everything degrades gracefully with reduced motion and on mobile.

Disclaimers

GlycoBay Living is educational only and is not medical advice. It's not a replacement for your care team. Talk to your doctor, dietitian, or diabetes educator before changing medication, insulin, carb targets, fasting, or your treatment routine.

Voice — say this

Pair your carbs.Most days, not perfect.Trade up, don't give up.Simple beats perfect.Patterns, not perfection.Less panic, more plan.A steadier plate starts with one better pairing.Cute tools for serious routines.

Claim safety — never say / always say

🚫 Never✅ Instead

Reverses / cures diabetes

Supports steadier habits

Doctor approved

Built from real clinic experience

Lowers your A1C / guaranteed

Designed to make meal planning easier

Fixes your blood sugar

May help you feel more confident around food