Oil UI
Helps your agent design web pages and app screens, and compare directions side by side
by Zhihuang Lin
Taste Skill
by Leon LinSkillMake visuals
Gets your coding agent to design web pages with an art direction, not a template look
About Taste Skill
A design skill for coding agents that build websites and app screens. Given a brief, it chooses an art direction, builds the page with real photos from open collections and checks the result in a browser.
For Small business ownersMakers building their own siteDesigners using coding agents
Made by Leon Lin
An open-source project by developer Leon Lin, published on GitHub under the MIT License.
- Stars
- ★ 106k
- License
- MIT
- Cost
- Free
- Level
- Intermediate
- Contents
- Includes scripts
Overview
Taste Skill is a design skill for coding agents that build websites and app screens. You give it a brief; a script deals three of 20 researched design directions, the agent picks one, builds the page with real pictures from open collections, then checks it in a real browser at three widths and fixes the top problems. Dashboards and app screens get their own route and rules. It suits makers and small businesses who want a page that looks designed.
It works from a study of 247 curated sites and checks its own screenshots, so the agent moves away from the familiar AI landing-page look.
Try these first
Start with the first one: it is a small task you can check easily.
- Build a one-page site for [a small local business], then tell me which design direction you picked and why.First try · writes files
- This page looks generic: [path to page]. Look at it in the browser and list the three biggest design problems before changing anything.
- Design a dashboard screen for [what the app tracks] with a table and two charts.writes files
- List the credits for every picture you used on this page.
Example prompts written by Agent Flows Hub.
What you get
From the creator's documentation.
| Output | What it is | Reads |
|---|---|---|
| Design directions | A script deals three of 20 researched directions with type, palette and section layouts | Your computer |
| Real pictures | Finds openly licensed photos and footage in open collections and records each credit | Internet |
| Browser check | Renders the page at 1440, 768 and 390 pixels wide and flags common AI-page patterns | Your browser |
| Look and fix | Reviews its own screenshots and fixes the top three problems, up to three rounds | Your project files |
| App screens | A separate route for dashboards, admin views and settings screens | Your project files |
Good to know
Build or redesign a landing page, portfolio or product page that should not look like a generic AI page. The skill picks a design direction, finds openly licensed pictures with credits, and checks the result in a real browser before the agent hands it over.
Limits
- A build takes roughly 30 to 45 minutes and a few hundred thousand tokens. Its scripts need Node.js 22+ and an installed Chrome, Edge or Chromium.
- Pictures it finds keep their own licences (public domain, CC0, CC BY and CC BY-SA); the page must carry the credits, and you can replace them with your own photos.
Notes by Agent Flows Hub (original project name: design-taste-frontend (Taste Skill)), written from the creator's documentation, not from running it ourselves. Taste Skill: README and install · design-taste-frontend: skill documentation
Stuck setting it up?
Tell us what happened. We take a look first; if it needs paid work, you get an estimate before anything starts.
More to make visuals
Other skills
- Template Infographics Makes a clean, template-based infographic page you open in your browser
- Three-Pass Chinese Proofreader Proofreads a Chinese article in three passes so it reads less like AI wrote it
- TourMind Hotel Booking Lets your AI agent search hotels worldwide, compare live room prices and book
- Value-Investing Checklist Runs listed companies through a six-gate pre-buy checklist and rates each one
- Video Shotcraft Turns your product's real pages into an edited promo video with music and sound
- Visual Idea Boards Builds mind maps and idea boards you can rearrange in Obsidian