DAVE is a personal and experimental design system.
DAVE was created so I can experiment rapidly building outputs for mixed-methods research, AGUI and software for various projects.
It's built on the shoulders of a lot of amazing open source work, but it's ultimately for me — a sandbox to learn, iterate, and build things I actually want to use in my projects. If it happens to be useful to you too, that's a wonderful bonus.
DAVE stands for DesignAdVancedEngineering. But really it's named after my best mate who is a no nonsense carpenter.
01 · What's in here
Components50+ React components — forms, tables, overlays, data display, navigation.
ChartsA small charting library built on Recharts, styled to match.
AI componentsA few things for building LLM interfaces. Work in progress.
TokensA colour + spacing system that themes the whole thing with a few CSS variables.
02 · Built on the shoulders of
Radix UIEvery interactive component is built on Radix primitives. Accessibility and behaviour, done right at the base layer.
Tailwind CSSAll styling. No CSS files, no modules, no fighting specificity — just utility classes that compose cleanly.
TypeScriptEverything is typed. Props, variants, context values. If it compiles, it works.
ReactObviously. But worth saying — this is a React-first system, not framework-agnostic by accident.
RechartsThe chart layer. Wrapped tightly enough that you don't need to know it's there.
Next.jsPowers this docs site. The components themselves are framework-agnostic.
A few honest things
- —There is a roadmap. I just don't promise to follow it.
- —There's no versioning promise. This is for me first.
- —It's MIT licensed. Take whatever's useful.
- —Accessibility matters to me, so that part is done properly.
- —Built with Claude. We have a good working relationship.
03 · Conceptualised by
Haydyn Phillips
0 to 1 product leader, psychologist and researcher.