<!-- SPDX-License-Identifier: MIT -->
<!-- SPDX-FileCopyrightText: 2025-2026 Marcus Quinn -->

# Design System: Playful Vibrant — Overview

## Visual Theme & Atmosphere

This design system celebrates energy, joy, and creative expression. It serves products where delight is a feature — children's education apps, gaming platforms, social communities, creative tools, and consumer products that embrace fun as a core value. The interface should make users smile before they even interact with it.

The palette is bold and saturated, anchored by a rich indigo primary that conveys creativity and imagination, paired with a warm rose accent that adds energy and urgency to key moments. Colours are used generously — not just for interactive elements but as environmental features: tinted backgrounds, gradient highlights, and colourful illustrations. This is not a system that whispers; it speaks with enthusiasm.

Every shape is rounded. Large border-radii (16–20px) soften all hard edges, creating a toy-like quality that feels safe, inviting, and tactile. Typography uses a rounded sans-serif that reinforces the friendly character. Micro-interactions are bouncy and responsive — elements spring, grow, and celebrate user actions with visible joy. The overall density is medium, balancing abundant content with enough whitespace to avoid visual chaos.

**Key characteristics:**

| Attribute | Value |
|-----------|-------|
| Mood | Energetic, playful, joyful, expressive |
| Primary colour | Indigo `#6366f1` |
| Accent colour | Rose `#f43f5e` |
| Background | Near-white `#FAFAFA` with colourful section tinting |
| Border treatment | Minimal borders; colour and shadow define boundaries |
| Animation | Bouncy — spring easing, scale transforms, celebratory micro-interactions |
| Imagery style | Illustrations, bold icons, character art, bright photography |
| Overall density | Medium — content-rich but well-organised |

<!--
Style archetype by AI DevOps (https://aidevops.sh)
DESIGN.md format: https://stitch.withgoogle.com/docs/design-md/overview
Not based on any specific brand. Use as a starting point for your project.
-->
