Design a personal website from a markdown spec
The author had Codex CLI read a design spec and iterated on it to design his personal site, and he can reuse the spec on other projects.
Done withCodex
- What they did
- The author copied the long design prompt from Anthropic's frontend-design plugin for Claude Code and pasted it into a local markdown file in his project. In a Codex CLI session he first had Codex read that file and treat it as the design spec for his personal site. Then it generated the UI, and he steered it through a few rounds of iteration.
- How it went
- Codex nearly got the design right in one shot, and the follow-up iterations were fast and accurate. He shipped a site he's happy with, replacing a very basic earlier version. The source gives no metrics.
- Worth knowing
- The spec is just a markdown file, so you can reuse it across projects and swap in different design prompts. Expect a few iterations and keep your own taste in the loop.
Try it yourself with Codex
Read the design spec in [path to your markdown spec file] and use it to design a [personal site / landing page] for [your name or project] in this folder. Build a first version, then show me how to preview it and wait for my feedback before changing anything big. Once I approve a version, list any rules from the spec that should be updated so I can reuse it on other projects.
Source: wilbertliu.com · Undated
Five of these in your inbox every morning
The best things people got an AI agent to do, each with the prompt to try it.
More like this
Turn tickets into merged pull requests
Pulls tasks from GitHub Issues or Linear, then runs Claude Code or Codex in isolated Kubernetes pods to carry each one through to a PR.
Recommend a hotel from client notes using Codex
A travel advisor had Codex use client notes to recommend a Belmond hotel in Italy, checking live booking engines and generating a detailed Word doc.
Build a racing game from a single prompt
Codex made a racing game with multiple racers, eight maps and items from one prompt, acting as designer, developer and QA tester by playing it.
- Custom agent
Edit raw footage by describing the video you want
Cardboard goes from raw footage to an edited video from natural-language instructions.
Edit and migrate Substack posts with a browser agent
The author gave Claude in Chrome three Substack tasks (live edit, post migration, note insertion), walked away, and returned to find all three published correctly.
Explore code to write technical documentation
A technical writer uses Devin to explore code before documenting it, plus a Slack writing agent built on Devin, reporting about 20,000 lines of docs per month.