Skip to main content
Elizabeth Stein
Design UniverseOpen to workHomeWorkAboutContact

Case study

design2024

Color Studio

Advanced color manipulation tool for designers with live previews and palette generation.

Where design meets code and pixels come alive

Field notes

Role

Designer & Developer

Read order

Evidence first, then constraint → build → proof. Use the chapter rail to jump sections; orbit to adjacent work from the bottom of the case study.

Design Universe·✦II-Class Star
●LIVE
View on GitHub
View Live Site
Source Code

Evidence

Interface & evidence

A real surface area—not a mock. Scroll the story below for constraint, build, and outcome.

Signature viewcolor-studio-mu.vercel.app
Color Studio application interface
Open Live Site
color-studio-mu.vercel.app

Story arc

How this shipped

Where design meets code and pixels come aliveThree beats: what pressed against the work, how the stack answered, and what changed once it was live.

I · Constraint

The brief

Color tools are either too simple (basic pickers) or too complex (professional design software). Accessible WCAG contrast checking is rare.

II · Build

The craft

Built intuitive palette generation with WCAG contrast checking built-in. Live previews show colors in UI context, not isolation.

III · Proof

What moved after launch

WCAG contrast checking prevents accessibility issues at design time. Palette generation creates harmonious schemes in seconds. Context previews reduce revision cycles.

Inventory

Stack & signals

React
← Project archive

Tell me what you're building

If you need someone who can own UI, systems, and AI integration without losing the plot—I'm listening. Contract, advisory, or full-time: we'll find the right shape.

Start a ConversationSee More Projects

Related work

Same clustersignal 2
Signal: Low
React

Studio Furniture

Elegant furniture studio e-commerce website with product showcase, filtering, cart functionality, and modern minimalist design.

Nearby systemsignal 1
Signal: Low
React

Coulson One

Enterprise-scale TypeScript/React application with 64,806 files. Led architecture decisions and core feature implementation for aviation resource management.

Nearby systemsignal 1
Signal: Low
React

CAIPO.ai

Designed and built an AI-powered platform as part of the Flo Labs 6-site ecosystem. Led frontend architecture, component integration, and UX for complex AI interactions.

Keep exploring

Previous Project

CodeCraft: Galactic Developer

Educational coding game combining real programming with space colony gameplay. Three.js real-time 3D visualization, Monaco editor for live code editing, Redux state management, narrative-driven progression.

Next Project

Space Travel Website

Immersive space tourism website showcase with modern animations and parallax effects.

© 2026 Elizabeth Stein

·Contact·Privacy
Let's work together → GitHubLinkedIn

Built with Next.js, Three.js, and obsessive attention to detail.