TEMPLATES

UI templates for AI agents.

Complete app and website designs, not just themes: every screen a product needs, with realistic content, in plain HTML and Tailwind. Clone one, and Codex or Claude Code turns it into your product.

• Running appMobile appA free running and fitness app UI template: eight phone screens in HTML and Tailwind, with a design system, ready for Codex or Claude Code to turn into your app.8 screens · Free and open source
• Food delivery appMobile appA free food ordering and delivery app UI template: eight phone screens in HTML and Tailwind, from menu to tracking, ready for Codex or Claude Code to make yours.8 screens · Free and open source
• Budgeting appMobile appA free budgeting and expense tracker app UI template: eight phone screens in HTML and Tailwind with data that adds up, ready for Codex or Claude Code to make yours.8 screens · Free and open source
• Meditation appMobile appA free meditation and sleep app UI template: eight phone screens in HTML and Tailwind, with a player, breathing guide, and sleep stories, ready for Codex.8 screens · Free and open source

How the templates work

1. Pick a template for the kind of product you’re building.
2. Copy just that one with npx degit ummydev/ui-templates/apps/<name> my-app.
3. Ask your agent to make it yours. Each template includes its design system as a DESIGN.md, so every new screen matches the ones already there.

Every template is free and open source under the MIT license, on GitHub at ummydev/ui-templates. More are on the way: meditation, a SaaS landing page, and a SaaS dashboard.

Frequently asked questions

Why HTML and Tailwind instead of a framework?

Plain HTML opens anywhere and any AI agent can read it. Once you’ve made the design yours, ask your agent to rebuild it in React, Next.js, React Native, SwiftUI, or Flutter.

Can I start from a design system instead?

Yes. The design system library has 24 systems for websites and apps that you can give your agent as a DESIGN.md.