Building HTMLColorHex.com — a full-stack color reference platform with AI automation
From zero to a production-ready competitor in the color tools market — complete with 8 interactive tools, an AI content engine, community palette builder, and a zero-dependency custom CMS.
A color tool site that could actually compete
Marcus Delaney, a digital product entrepreneur based in Austin, Texas, came to us with a clear but ambitious brief: build a color reference platform capable of competing with established players like color-hex.com, htmlcolorcodes.com, and coolors.co — but do it with a modern architecture, a better content strategy, and a fully managed backend that a non-technical founder could run day-to-day.
The platform needed to serve multiple audiences simultaneously: developers looking up HEX codes, designers exploring color harmonies, and casual creatives browsing palettes for inspiration. It also needed to generate organic traffic through SEO-optimized content from day one.
The core challenge
Build a production-grade SaaS-quality platform — without bloated frameworks, without a team of six, and without months of agency back-and-forth. It needed to be lean, fast, and fully owned by the client.
Lean stack. Zero dependencies. Maximum control.
We made a deliberate architectural choice: no Laravel, no React, no npm build chain. Raw PHP 8.2, a clean MySQL schema, and hand-crafted vanilla JavaScript. This kept the deployment surface minimal, the site blazingly fast, and the codebase entirely in the client’s hands.
Architecture & Database Design
Designed a 10-table relational schema covering colors, palettes, users, blog posts, color-of-day entries, navigation, CMS pages, favorites, likes, and site settings. Every table indexed for the query patterns each public page would need.
Core Public Pages & Tools
Built the full public-facing site: 8 interactive browser tools (all using Canvas API and vanilla JS), color detail pages, color chart, names index, palettes directory, blog, color stories, and artist profiles — fully mobile-responsive.
Admin Panel & CMS
Developed a bespoke admin panel with 10+ management modules. No WordPress, no Strapi — a custom CMS built exactly around the site’s content model, with role-based access control and CSRF-protected forms throughout.
AI Content Engine
Integrated OpenAI GPT-4o to auto-generate “Color of the Day” stories — narrative editorial content for each color featuring mood analysis, cultural context, design applications, and tagged keywords. Includes bulk date-range generation and a curated color list feature.
SEO, Monetization & Deployment
Configured Apache URL rewriting for clean SEO-friendly routes, generated dynamic XML sitemaps, wired up Google Analytics 4, AdSense with 4 ad zones, Meta Pixel, and Google Tag Manager — all manageable from a single settings screen.
Eight tools. One cohesive experience.
Every tool on the platform runs entirely in the browser with no server round-trips — fast, private, and offline-capable. All built from scratch with the Canvas API and vanilla JavaScript.
Color Reference System
- Every color has its own SEO page with HEX, RGB, HSL, CMYK, 10-step shade/tint scale, and 3 harmony types
- Color Chart with tabbed views: named CSS colors, web-safe palette, flat design, and material design swatches
- Complete CSS named color index — all 140 colors with search and copy
- Color browse page with hue-based filtering and infinite scroll pagination
Community Palette System
- Registered users can create, name, tag, and submit multi-color palettes for community review
- Each palette gets a shareable slug URL with one-click CSS variable export
- Like system, featured flag, and view counter per palette
- Artist profiles showing all published palettes and user bio
Color of the Day — AI Editorial Content
- Daily editorial content — each color gets a unique narrative written by GPT-4o
- Stories include title, mood descriptor, cultural context, design applications, and SEO tags
- Browsable archive with year/month filtering
- Every story page has a full-bleed hero in the featured color
Blog & User Accounts
- Full blog with categories, tags, featured images, and rich text content
- User registration, login, profile management with avatar, bio, social links
- Personal dashboard: saved favorite colors, created palettes, palette studio
- Artist public profile pages with palette portfolio
A complete control center — no third-party CMS required
The admin panel was built from scratch to match exactly what a non-technical founder needs to run a content-heavy platform. Every module is purpose-built for HTMLColorHex’s specific content model — no bloat, no plugins, no monthly fees.
Automated content at editorial quality
The most distinctive feature of the platform is its AI-powered content engine. Rather than paying writers to produce hundreds of color stories, the admin can generate them in bulk — or let a daily cron job handle it automatically.
- Each story is generated by GPT-4o with a carefully engineered prompt that produces: a story title, a 400–600 word editorial narrative, a mood descriptor, 5–8 semantic tags, and a cultural/emotional interpretation of the color
- Bulk generation supports date ranges up to 365 days — the system batches API calls with rate-limit-safe delays between each
- Curated color list mode lets admins pre-assign specific HEX codes and color names to specific dates, giving editorial control over the AI output
- Each generated story is stored in the database with a
generated_by: aiflag for traceability - Cron job support: a CLI-only PHP script that can be scheduled via cPanel to auto-generate tomorrow’s story overnight
Estimated content value
At $80–$120 per professionally written color story, generating 365 stories manually would cost $29,200–$43,800 per year. The AI engine produces the same output at roughly $0.003 per story — full year coverage for under $2.
Lean, fast, fully owned
Every technology choice was made to maximize performance, minimize hosting cost, and keep the codebase maintainable without a standing engineering team.
No Framework Overhead
Pure PHP and vanilla JS — no Composer dependencies on the front-end, no npm build step. Pages load in milliseconds on shared hosting.
Security By Design
CSRF tokens on every form, PDO prepared statements on every query, role-based middleware, and input sanitization throughout.
Portable & Self-Hosted
Runs on any PHP 8.2 + MySQL 8 host. Deployable to cPanel shared hosting — no Docker, no VPS required.
SEO-First Architecture
Clean URL routing via .htaccess, dynamic XML sitemaps, per-page canonical tags, Open Graph meta, and structured semantic HTML throughout.
The result: a production-ready platform, built weeks not months
What would have taken a team of three developers, a UI designer, and a content strategist 6–8 months to build was delivered as a fully functional, deployable product — with zero third-party framework licensing, zero recurring SaaS tool cost, and a codebase the client can maintain independently.
“I came in with a napkin idea and left with something I’m genuinely proud to show investors. The team understood the product deeply — not just the code, but the audience. Designers actually use this. That’s the win.”
— Marcus Delaney, Founder, HTMLColorHex · Austin, TX
