Work16Frontend & tooling

Spectra

Colour palettes and CSS gradients, instantly — lock, regenerate, export, share by link.

Role
Solo — design, engineering, deployment
Language
TypeScript 86.6% · HTML 5.8%
Timeline
Jun 2026 → Jun 2026
Last push
3 months ago · 6 commits
Spectra — screenshot of the live product
gzipped
~69 KB
harmony schemes
4

Five-colour palettes from real harmony schemes, a gradient studio with live angle control, exports to CSS variables, Tailwind config or JSON, and palettes that live in the URL.

Problem

Palette tools are either toys or subscriptions. Spectra is a fast, shareable, client-side utility at ~69 KB gzipped.

Approach

  1. 01

    Analogous, triadic, complementary and monochrome schemes; lock swatches and press space to regenerate the rest.

  2. 02

    An interactive Three.js palette orb with a one-tap 3D toggle.

Results

gzipped
~69 KB
harmony schemes
4
Created
7 Jun 2026
Commits
6
Default branch
master
License
NOASSERTION

Stack

  • React
  • TypeScript
  • Vite
  • Tailwind CSS
  • Three.js