Image: GitHub
Why it mattersA team asking a coding agent for a landing page usually gets one draft that gets edited into "fine", and this is an open skill that forces several distinct directions before any work is kept.
Ask a coding agent for a landing page and it gives you one draft that gets edited into "fine", because the first idea becomes the only idea. Oil UI, an open-source skill for Claude Code and Codex, forces the agent to produce several genuinely different directions, put them on one comparison page, and only refine whichever one you pick. The repository picked up 999 stars in the seven days after it went up.
What it does differently from a plain prompt
The README names the steps the skill tells an agent to follow before any pixel is placed. It first names what the product is and looks at two or three peers with the most distinctive styles. It turns "premium" and "clean" into visible choices about typefaces, white space and colour share. Each direction starts from one concrete thing: a material, a scene, a character, or the visual language of another field. The directions have to be truly different, and the rule the skill enforces is that of layout, typography, colour and key imagery, any two directions may share at most one.
The output is a side-by-side comparison page. HTML files, images, or a running development server can go into it, including the current version as a baseline. You switch between desktop and mobile sizes, open each at full size, and click "Select" on the one that stays. The agent then tightens the design against your written feedback.
What the open source version covers
The MIT TypeScript skill carries the design-direction work, the visual decisions, memorable moments and scroll storytelling, screenshot recreation, and the pacing and feel of small games. Review is a scored report with issues listed. The skill carries no configuration and no API keys of its own, because the coding agent already has the model it calls.
A paid Pro tier at 69 yuan adds repeated review against a 9/10 bar, usability work on forms and dialogs, workspace layouts for dashboards, procedures for improving an existing project, and effects such as light trails and dot patterns. The author says the open-source and Pro skills should not be installed together, because they compete for the same requests.
Traction and limits
Oil UI's gallery at ui.oiloil.org shows past outputs including an English learning app, a music year in review, hardware and component library sites, a project management tool, a ride-hailing app, a voice assistant, a checkout flow and a film camera. GitHub shows 999 stars and 55 forks on a week-old repository.
The author recommends two companion skills for cases Oil UI does not solve on its own. The draw-ui skill generates design images with an image model first, picks one, then implements it, which handles the case where code-first iteration keeps missing the look. The oil-motion skill produces scroll-driven and drag-driven video animations for pages where the opening motion is the point.
Source
oil-oil/oil-ui, GitHub.
This item was written by an AI system from the linked source. Reveneau is responsible for what it publishes.
Get AI News in your inbox
New developer tools, model and agent releases, and how teams are actually using them to release software. Short, and only when there is something worth reading.