Individual skill
finesse-ui
Build and refine high-craft web interfaces: brand sites, product dashboards and workflows, AI workbenches, commerce, H5/mobile screens, and individual components. Route by purpose, preserve project identity, and audit visual quality, accessibility and motion. Supports Apple-inspired / 苹果风 design through editorial, app and spatial modes with runnable card studies. Use for landing pages, portfolios, dashboards, admin panels, settings, agent consoles, product pages, checkout, mobile app UI, design-system extraction, redesign, typography, color, layout, animation, drag/swipe/sheet interactions and anti-generic iteration. Includes targeted audit, bolder, quieter, soul, diverge, animate, depth, densify, init and document workflows. Excludes backend-only tasks.
skills/finesse-ui/SKILL.md
Source commit c7a91448baf6e98fecf542915cdb7e3155bddc45
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- Yes
- Repository scan complete
- No
- Skill scan complete
- No
- Observed behavior
- Network or broad shell
- Last checked
- Nov 4, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 966
- Repository last updated
- Oct 23, 2026
- License
- MIT
Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.
- design Derived category
- marketing Derived category
- writing Derived category
- security Derived category
- design-interface Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
SKILL.mdcore · 77,386 bytesSKILL.mdcore · 77,386 bytesagents/openai.yamlasset · 271 bytesexamples/EXAMPLES.mddoc · 22,961 bytesexamples/acru-financial-dashboard.htmlasset · 30,782 bytesexamples/aether-cinematic-tech.htmlasset · 17,175 bytesexamples/apple-bento.htmlasset · 905 bytesexamples/apple-contrast.htmlasset · 911 bytesexamples/apple-corners.htmlasset · 909 bytesexamples/apple-gallery.htmlasset · 909 bytesexamples/apple-layout.htmlasset · 907 bytesexamples/apple-overview.htmlasset · 911 bytesexamples/apple-palette.htmlasset · 909 bytesexamples/apple/ASSETS.mddoc · 1,813 bytesexamples/apple/media/product-study-01.jpgasset · 80,190 bytesexamples/apple/media/product-study-02.jpgasset · 165,148 bytesexamples/apple/media/product-study-03.jpgasset · 439,808 bytesexamples/apple/media/product-study-04.jpgasset · 99,554 bytesexamples/apple/media/product-study-05.pngasset · 365,648 bytesexamples/apple/media/product-study-06.pngasset · 535,602 bytesexamples/apple/media/product-study-07.jpgasset · 93,274 bytesexamples/apple/media/product-study-08.jpgasset · 57,654 bytesexamples/apple/media/product-study-09.jpgasset · 36,846 bytesexamples/apple/media/product-study-10.jpgasset · 585,543 bytesexamples/apple/media/product-study-11.jpgasset · 141,540 bytesexamples/apple/motion.jsruns · 3,351 bytesexamples/apple/studies.cssasset · 21,500 bytesexamples/apple/studies.jsruns · 24,900 bytesexamples/buildly-growth-dashboard.htmlasset · 26,507 bytesexamples/caliber-precision-horology.htmlasset · 33,002 bytesexamples/flux-fluid-simulation.htmlasset · 26,798 bytesexamples/h5-brew-mobile-pdp.htmlasset · 29,321 bytesexamples/h5-fern-meal-desk.htmlasset · 40,741 bytesexamples/h5-pawpal-app-shell.htmlasset · 49,791 bytesexamples/h5-peach-daily-desk.htmlasset · 44,469 bytesexamples/h5-sheet-lab.htmlasset · 59,351 bytesexamples/huddle-team-workspace.htmlasset · 23,627 bytesexamples/inkline-publishing-cms.htmlasset · 24,443 bytesexamples/ledgerio-treasury-console.htmlasset · 27,768 bytesexamples/lib/Draggable.min.jsruns · 35,497 bytesexamples/lib/Flip.min.jsruns · 25,013 bytesexamples/lib/ScrollTrigger.min.jsruns · 44,157 bytesexamples/lib/gsap.min.jsruns · 72,435 bytesexamples/morph-variable-type.htmlasset · 17,126 bytesexamples/nodeflux-api-console.htmlasset · 23,102 bytesexamples/nova-brutal-typographic.htmlasset · 12,391 bytesexamples/offscreen-editorial.htmlasset · 10,409 bytesexamples/pawcare-adaptive-health.htmlasset · 31,967 bytesexamples/relay-agent-console.htmlasset · 47,010 bytesexamples/signal-phosphor-terminal.htmlasset · 18,609 bytesexamples/sparkcraft-bauhaus-geometric.htmlasset · 33,844 bytesexamples/stakent-monitoring-dashboard.htmlasset · 26,325 bytesexamples/studio-quiet-luxury.htmlasset · 22,915 bytesreferences/3d-effects.mddoc · 13,758 bytesreferences/ai-console.mddoc · 25,716 bytesreferences/anti-cheap.mddoc · 19,571 bytesreferences/apple-design.mddoc · 7,629 bytesreferences/apple-patterns.mddoc · 4,114 bytesreferences/asset-sourcing.mddoc · 14,793 bytesreferences/audit.mddoc · 8,851 bytesreferences/chart-crafting.mddoc · 17,655 bytesreferences/commerce-ui.mddoc · 9,295 bytesreferences/component-scope.mddoc · 9,959 bytesreferences/dataviz.mddoc · 14,490 bytesreferences/design-dna.mddoc · 14,931 bytesreferences/design-model.mddoc · 4,932 bytesreferences/divergence.mddoc · 25,708 bytesreferences/document.mddoc · 3,181 bytesreferences/h5-mobile.mddoc · 39,999 bytesreferences/hero-engines.mddoc · 23,945 bytesreferences/init.mddoc · 4,270 bytesreferences/inspiration-catalog.mddoc · 11,204 bytesreferences/interaction-motion.mddoc · 19,628 bytesreferences/mobile-floor.mddoc · 8,899 bytesreferences/motion.mddoc · 21,930 bytesreferences/page-crafting.mddoc · 34,463 bytesreferences/plain-words.mddoc · 8,281 bytesreferences/preflight.mddoc · 19,476 bytesreferences/product-palettes.mddoc · 24,406 bytesreferences/product-ui.mddoc · 28,733 bytesreferences/redesign-mode.mddoc · 5,536 bytesreferences/style-personas.mddoc · 5,142 bytesreferences/theming.mddoc · 6,196 bytesreferences/workflow-ui.mddoc · 18,698 bytesscripts/detect.mjsruns · 23,752 bytesscripts/test-apple-detector.mjsruns · 2,357 bytes
Read excerpt
# finesse — Technically Spectacular · Soul-Distinct · Never Cheap
> **finesse builds two kinds of interface and routes by register (§0):**
> - **brand** — design IS the product: landing pages, brand sites, launches, portfolios, hero pages. Optimize for **spectacle + soul + first impression** — a real visual engine, an opinionated personality.
> - **product** — design SERVES the product: dashboards, admin panels, analytics, data tables, app shells, settings. Optimize for **clarity + density + usability** — and still never cheap.
>
> The through-line is identical: **high craft, zero AI-slop.** What applies to **both** is the **universal craft floor** (tinted neutrals, no `#fff`/`#000`, translucent/hairline borders, tinted shadows, contrast floors), the cheapness blacklist (§6), and the pre-flight (§8). What **forks** is the *substrate above that floor* and the middle: **brand** lays the §3 brand substrate (`design-dna.md` — grain, vignette, display type) and reaches for a hero engine (§4); **product** lays its **own** substrate (`product-ui.md` §0 — surfaces, cards, KPI tiles, density) and reaches for a component system + data viz. A dashboard is a **different design language**, not a brand page with charts — it does **not** inherit grain / vignette / giant hero type / dark-default / a hero engine.
>
> **Two more registers sit alongside them, and they work differently from each other.** **commerce** (PDP/PLP/cart/checkout) is a *hybrid* — route it to brand or product by what the specific page is doing. **h5** (phone-only screens: app UI, 活动页, mobile PDP, report H5) is a **container**: it fixes the frame, the safe areas, the thumb hierarchy, and the OS furniture, then wraps one of the other three for the content grammar underneath. A mobile PDP is `h5` + `commerce`; an app dashboard screen is `h5` + `product`. h5 never replaces a content register — it wraps one.
>
> Every rule below is **contextual**. Nothing fires automatically. Read the brief, set the register, then pull only what fits. A skill that produces the same page for every brief has failed.
---