k-style-ui-ux plugin

A Claude Code, Codex and Cursor plugin that turns a PRD into draft mobile screens in a Korean app style in about 15 minutes

  • 400 ★ on the repository
  • Last commit
  • MIT
Plugin

Extended access

Why this level

  • The agent creates HTML files in the working folder and runs Python check scripts and screenshot capture.
All reasons and checks

vmc-inner-circle/k-style-ui-ux

Install

In your terminal, with SkillFoxx CLI

npx skillfoxx add plugins/k-style-ui-ux

Detects the agents on your machine, shows the access level and pins the version.

Other ways to install

Access and checks

How we review

Extended accessThe tool runs code or makes network calls and only reads external data.

  • The agent creates HTML files in the working folder and runs Python check scripts and screenshot capture.

This is third-party code. Review the repository files before installing.

What it does

k-style-ui-ux takes one requirements document and produces an HTML draft of mobile screens with a flow map. For every object a user creates or requests, the plugin builds the full path: start, view, edit and result screen. It first checks that the main feature is easy to reach, and styling comes after. Colours come from palettes collected from Korean services such as 29CM, Airbnb, Class101, Danggeun, Kurly and Musinsa. In the result three palettes switch with one click. Spacing, font sizes and Fluent Emoji icons are preset. Before handing over, the `selfcheck.py` and `audit.py` scripts check tokens and components, missing screens and Korean line breaks. The agent reviews screenshots against a checklist and fixes P0 and P1 issues. The `max` command adds error, confirmation and empty-state screens in a second pass.

Who it is for. Founders and developers who build a first app version without a designer and want to see screens before ordering design work.

Good fit when

  • You have a PRD for a new booking service and want the whole user path on screens before hiring a designer.
  • An internal tool has to be designed by you, and interface experience is lacking.
  • A designer needs a quick first draft that only needs polishing later.
  • The app targets a Korean audience, and screens should feel familiar to local users.

Not a fit when

  • You need production-ready design with polished copy and details.
  • The look should be familiar to Western or Russian users, while the palettes come from Korean services.
  • You need a Figma layout, and the plugin produces HTML.

Example request

/k-style-ui-ux:go prd/pilates-booking.md

Limitations

The plugin makes a draft: details, taste and copy stay with a person, and the authors state that it does not replace a finished product. Documentation and prompts are in Korean, and the line-break checks are tuned for Korean text. The first pass takes about 15 minutes and the second about 10 more, while complex PRDs took up to 23 minutes. The result is saved to `out/index.html` in the folder where the agent runs and opens in a regular browser.

How to disable. In Claude Code remove the `k-style-ui-ux@k-style-ui-ux` plugin through the plugin manager; in Codex and Cursor remove it in their plugin settings.

FAQ

How do I install k-style-ui-ux in Claude Code?

Run `/plugin marketplace add vmc-inner-circle/k-style-ui-ux` and `/plugin install k-style-ui-ux@k-style-ui-ux`. For a local try, use `claude --plugin-dir` with the plugin folder path.

How do I call the plugin in Codex and Cursor?

In Codex use `$k-style-ui-ux:go` and `$k-style-ui-ux:max`. In Cursor type a slash in chat and pick go or max.

Where do I see the result?

Open `out/index.html` in a browser. The canvas shows screens by flow, transition arrows and rules for each screen.

Does the PRD have to follow a template?

No. You can paste requirements text and ask for screens. Sample PRDs for a family trip, a wedding meetup and pilates booking sit in the `prd/` folder.

What does the second pass do?

The `max` command adds states the first draft skips: errors, confirmation dialogs and empty screens. It takes about 10 minutes.

Discussion

No questions or reviews yet.

Plugins

A skill with 107 styles, 127 palettes and 107 font pairings that generates a design system and audits interface code

PluginMinimal access100Repository stars

A skill with a searchable base of styles, palettes, font pairings and UX rules that generates a design system per product type

SkillExtended access148.9KRepository stars68Installs via CLI and agents

A UI design skill: three genuinely different directions side by side, one chosen and refined against real screenshots in agents like Claude Code

SkillExtended access3.2KRepository stars

An MCP server and skill for interfaces: 31 design systems for shadcn/ui, UI and UX principles and accessibility review for agent-written code

MCP serverExtended access576Repository stars
Official

An MCP server and plugin to build UI with the agent: curated design systems, UI prompts and layout variations

MCP serverExtended access2.2KRepository stars

A skill and CLI for agents: UI without the templated look, 25 commands, rule-based anti-slop checks and a 0 to 100 quality score

SkillExtended access452Repository stars

README in short

The Korean README explains who the plugin suits and how it differs, shows three sample PRDs with generation times and canvas screenshots. Below are installation for three agents, commands and how to send feedback.

README badge

Report a problem