Andrew Flett
GitHubLinkedInBluesky
Andrew Flett

Hi, I'm Andrew Flett.

I've spent 25 years at the intersection of design and engineering, taking things from rough idea to live product. In practice, that's meant directing technology and product strategy, designing the thing, and writing the code, sometimes in the same week. Less a deliberate career plan, more a restless curiosity about how all the pieces connect.

Colour Tokens

Not just palettes: a tool to build flexible and robust semantic colour systems

Open project
Messenger
AA
Aisha Ali
Your appointment is confirmed
Bristol
AF
Andrew Flett
Sorry I missed my appointment
Camden
WR
William R.
Can I rebook for next week?
Hackney
AA
Aisha Ali+44 7412 000018
I need help with my housing case
Your appointment is confirmed for tomorrow at 2pm.

LCN Messenger

What AI changes about delivering production software in complex and regulated domains

Open project
Mentoring non-profits to ship products in 3 months

Digital Accelerators

Mentoring non-profits to ship products in 3 months

Open project
Compliance
GDPR / UK DPA
Retention
active
SAR Export
Erasure
Audit Trail
Retention
Period
2 years
Trigger
inactivity
Mode
auto

Privacy Tools

Privacy and data rights: tooling that protects people, not just ticks boxes

Open project
Cascade: An icon library for CSS properties

Cascade

Cascade: An icon library for CSS properties

Open project
Launching a Live Chat service for vulnerable families when children's centres closed

Action for Children

Launching a Live Chat service for vulnerable families when children's centres closed

Open project
Pharmacy2U app home screen

Pharmacy2U

A mobile app for the UK's largest online pharmacy

Open project
Adding a new medication in Dosi

Dosi

Using on-device AI to make sense of medication schedules

Open project
LloydsDirect
Design System
TokensComponentsPatternsToolingDocs

Design System & Tooling

Standardising design ops and engineering practice for 15+ products at LloydsDirect

Open project
wtf
ExploreGenerate

hybrid_searchk=12
rrf_fuse
answer
37

WTF

An agentic RAG experiment across 20 years of professional history

Open project

Visual editing for
production frontends

$npx @designtools/surface

Surface

A multi-framework CLI design tool with both AI and deterministic edit modes

Open project
Line Draw
Bouncy
Rotation
Stagger

SVG Animator

Interactive SVG animation playground with Motion: make your icons bouncy

Open project
Hero panel

EnquiryDesk

Launching a niche SaaS to help Law Centres manage complex triage across calls, emails, and SMS

Open project
Terminal
$claude
Screenshot the messenger
isolate conversation thread
trim to 3 messages
replace names → dummy data
save docs/messenger.png
Updated MESSENGER.mdx

Capturing Compositions

Capturing live UI compositions with Claude Code

Open project
Terminal
$npx @designtools/shadows
detect tailwind v4
scan 6 custom shadows, 10 framework defaults
editor running at http://localhost:4410
Open browser to start editing shadows

Shadow Editor

Edit global shadows visually and write changes straight back to your code

Open project
skill.md
---
name: create-design-system
description: When asked to create design system
---
Create a robust design system with semantic tokens
## Colour Tokens
- `primary`, `secondary`...

Semantic Design Systems

A Claude Code skill for scaffolding design systems with semantic tokens

Open project

Icon Canvas

A browser-based SVG icon editor for creating and refining simple icons

Open project
dialog.html
<button commandfor="my-dialog" command="show-modal">
Open Dialog
</button>
<dialog id="my-dialog">
<p>Opened without Javascript!</p>
</dialog>

Primitive Primitives

More primitive primitives: exploring what vanilla HTML and CSS can do in 2026

Open project
depth-1
depth-2
depth-3

Shadow Explorer

A tool to design elevation scales and crispy layered box-shadows

Open project