Case study · Design tools
Chromos.
A web-based AI-powered platform that helps brands, designers, and product teams generate accessible, production-ready color palettes using natural language prompts.
- What we built
- AI-powered SaaS web platform and brand identity
- Stack
- Next.js, Tailwind CSS, Node.js, Express.js
- Services
- Web appAI palette generationBrand identity
About the project
What is Chromos?
This project involved the design and development of a web-based AI-powered platform that helps brands, designers, and product teams generate accessible, production-ready color palettes using natural language prompts. The platform transforms abstract brand intent, such as emotions, audience, region, and usage context, into structured, validated color systems. It combines AI-driven palette generation, accessibility validation, version control, and exportable brand documentation into a single streamlined workflow. The solution was built as a subscription-based SaaS MVP, focusing on individual users who need fast, reliable, and accessible color systems for digital products.
Mission statement
To transform color from a fragmented, guess-based process into a guided, consistent, and explainable workflow, and to give every designer a single place to turn intent into meaningful, accessible, and context-aware color systems they can trust and stand behind.
Brand challenges & opportunities
Need for a scalable, modern identity: a flexible, scalable logo and brand system ensures the identity works in all sizes, contexts, and mediums without losing impact. Bridge between creators & enterprise teams: the identity needs to feel approachable to creators but trustworthy and professional for enterprise clients. Must communicate intelligence + creativity: the logo and brand should visually express both creative intuition and rule-based reasoning. Align with the product roadmap: the logo and branding must remain future-proof and compatible with upcoming product features.
Core brand idea
Two Minds: Creative + Engineering. The product as the bridge where both meet.
Logo concept: The Harmonic Lens
A crystal color orb with kinetic lines. The orb acts as a "lens" through which raw color data is refined into beautiful, harmonious palettes. The surrounding lines are the visible manifestation of its intelligent processing.
Conclusion
This project demonstrates the successful delivery of an AI-driven SaaS platform that blends design intelligence, accessibility compliance, and production readiness into a single user experience. By combining conversational AI, strict validation rules, and export-focused workflows, the platform bridges the gap between brand strategy, design execution, and development handoff.
The problem
What was slowing them down.
- 01
Highly subjective and inconsistent
Creating a brand color system is often highly subjective and inconsistent.
- 02
Difficult to align with accessibility standards
Creating a brand color system is often difficult to align with accessibility standards (ADA/WCAG).
- 03
Time-consuming to iterate and document
Creating a brand color system is often time-consuming to iterate and document.
- 04
Hard to version, compare, and reuse
Color systems are hard to version, compare, and reuse across projects.
- 05
Translating brand ideas into usable palettes
Designers and founders struggle to translate abstract brand ideas into usable palettes while ensuring contrast compliance and export readiness for development teams. Existing tools either lack AI-driven intent understanding or fail to provide structured versioning and documentation.
The solution
What we built.
AI-powered chat interface
AI-powered chat interface that converts natural language into structured color intent.
Accessibility-first palette generation
Accessibility-first palette generation, enforcing ADA contrast at creation time.
Immutable palette versioning
Immutable palette versioning, enabling traceability and iteration history.
Manual color editing
Manual color editing with automatic accessibility validation.
Fillable brand guideline PDF generation
Fillable brand guideline PDF generation for real-world handoff.
Free vs Pro subscription enforcement
Free vs Pro subscription enforcement for scalable SaaS monetization.
Results
What changed.
Business value
Reduced time
Reduced time to create accessible color systems.
No manual contrast checks
Eliminated manual contrast validation for designers.
Improved collaboration
Improved collaboration between design and development via standardized exports.
Monetization
Enabled monetization through tiered subscriptions.
Repeatable workflow
Created a repeatable workflow for branding projects.
Clear differentiation
From a business standpoint, the platform positions itself as a design productivity tool with clear differentiation through accessibility, AI intent processing, and documentation automation.
Key challenges
The hard parts, and how we solved them.
Accessibility Enforcement: ensuring every palette meets ADA contrast requirements.
Built validation directly into the generation and editing pipeline, blocking or auto-adjusting invalid colors.
AI Intent Consistency: translating vague prompts into reliable outputs.
Introduced a structured intent layer (emotion, context, constraints) between user prompts and AI generation.
Version Control: maintaining traceability across multiple iterations.
Implemented immutable, timestamped palette versions per project.
Subscription Enforcement: differentiating Free vs Pro features without friction.
Centralized plan enforcement across prompts, projects, exports, and PDF generation.
Tech stack
What it runs on.
- Frontend & Backend
- Next.jsTailwind CSSNode.jsExpress.js
- AI & Processing
- Vercel AI SDKClaude AI
- Auth & Database
- Supabase (Auth & PostgreSQL)
- Vector Search
- Supabase Vector DB / Pinecone / Qdrant
- Infrastructure
- AWS EC2AWS Amplify
Process
How we got there.
01Landing & Project Creation
User enters an initial branding prompt · Optional upload of brand assets (image or PDF) · System validates inputs and creates a new project
02AI Palette Generation (Playground)
Prompts are converted into structured intent · AI generates a new palette version · Palette is validated for accessibility · Version is stored immutably with timestamp
03Iteration & Versioning
Users refine palettes via follow-up prompts · Every iteration creates a new version · Full version history is preserved per project
04Favorites & Manual Editing
Users can favorite palette versions · Manual color edits are allowed within accessibility constraints
05Export & Documentation
Export palettes in multiple formats (HEX, RGB, HSL, CSS variables, etc.) · Generate a fillable brand guideline PDF with metadata
More work.
All projects
Plan Assist
Compliance-first AI financial advisory platform enabling secure client-advisor-AI communication with audit trails and human oversight.
True Motion AI Chat Bot
AI-powered platform generating consistent, print-ready corrective exercise programs from assessments, enabling customization, automation, and efficient workflows for fitness professionals.
Building something like Chromos?