v1.0.0

Imajeure Design System

The Social Networking Activity Index • Complete component library built on shadcn/ui

7

Atoms

Button, Badge, Card, etc.

3

Molecules

RainbowPill, MetricCard

4

Organisms

AuraRing, ScoreDisplay, etc.

Rainbow Framework (ROYGBIV)

Seven semantic colors for creator metrics with Lucide icons.

Reputation#DF6844
Identity#E8A327
Presence#F0D03C
Sharing#38D430
Conversations#6CBFFC
Groups#597CFA
Relationships#7334AF

Design Principles

Flat Design 3.0

Clean, bold, confident. No gradients, no kitsch. Light, motion, and energy communicate meaning.

Mobile-First

Touch-optimized with 44px tap targets. Responsive/adaptive hybrid implementation.

WCAG 2.1 AA

4.5:1 contrast ratio, full keyboard navigation, proper ARIA labels throughout.

60fps Animations

GPU-accelerated canvas rendering. Respects prefers-reduced-motion preference.

Typography

Headings

Montserrat

Bold, confident, modern. Perfect for creator-focused UI.

Body

Inter

Highly legible at all sizes. Optimized for screens.

Tech Stack

Next.js 16React 19Tailwind CSS 4shadcn/uiRadix PrimitivesFramer MotionTypeScript 5.7Turborepo

All design tokens sourced from @imajeure/design-tokens