This product was not featured by Product Hunt yet. It will not be visible on their landing page and won't be ranked (cannot win product of the day regardless of upvotes).
Product upvotes vs the next 3
Waiting for data. Loading
Product comments vs the next 3
Waiting for data. Loading
Product upvote speed vs the next 3
Waiting for data. Loading
Product upvotes and comments
Waiting for data. Loading
Product vs the next 3
Loading
KMRVID Skills
60 production skills connecting Figma AI to Claude Code
Stop generic AI slop and broken design handoffs. KMRVID Skills provides 60 battle-tested custom skills across Figma Design Agent and Claude Code. Automate audits, tokens, Modern Tailwind CSS based frontend pipelines (React / Astro / Vanilla), and WCAG a11y. Built for production, open for learning.
I’m Masaaki, an independent UI/UX designer and frontend engineer since 2001.
Today, I’m thrilled to introduce KMRVID Skills — a complete 58-skill ecosystem designed to bridge the gap between Figma Design Agent and Claude Code.
Why I built this:
When working with AI design and coding agents, two major problems kept popping up:
Generic "AI Slop": Raw prompts constantly default to centered heroes, identical 2-column layouts, and predictable cream/terracotta palettes.
Broken Handoffs: Design agent outputs are full of messy auto-generated layers (Frame 1234), hardcoded values, and broken auto-layouts that downstream coding agents struggle to parse.
KMRVID Skills solves this by establishing an end-to-end, disciplined pipeline:
In Figma (18 Skills): Auto-audit node readiness, bind variables (Color/Type/Spacing), auto-fix WCAG contrast, and generate Dev Mode annotations directly via Plugin API.
In Claude Code (40 Skills): Zero-prompt project setup, cognitive-UI layout topologies (Z/F/I/Bottom-up), Tailwind-based frontend pipelines, and vision-based alt-text generation.
🎁 Product Hunt Launch Offer (Limited Copies)
We’ve tailored 3 packages depending on your workflow:
“60 production skills connecting Figma AI to Claude Code”
KMRVID Skills was submitted on Product Hunt and earned 2 upvotes and 3 comments, placing #42 on the daily leaderboard. Stop generic AI slop and broken design handoffs. KMRVID Skills provides 60 battle-tested custom skills across Figma Design Agent and Claude Code. Automate audits, tokens, Modern Tailwind CSS based frontend pipelines (React / Astro / Vanilla), and WCAG a11y. Built for production, open for learning.
On the analytics side, KMRVID Skills competes within Design Tools, Developer Tools and Artificial Intelligence — topics that collectively have 1.3M followers on Product Hunt. The dashboard above tracks how KMRVID Skills performed against the three products that launched closest to it on the same day.
Who hunted KMRVID Skills?
KMRVID Skills was hunted by Masaaki Komori. A “hunter” on Product Hunt is the community member who submits a product to the platform — uploading the images, the link, and tagging the makers behind it. Hunters typically write the first comment explaining why a product is worth attention, and their followers are notified the moment they post. Around 79% of featured launches on Product Hunt are self-hunted by their makers, but a well-known hunter still acts as a signal of quality to the rest of the community. See the full all-time top hunters leaderboard to discover who is shaping the Product Hunt ecosystem.
For a complete overview of KMRVID Skills including community comment highlights and product details, visit the product overview.
Masaaki Komori
Hey Product Hunt community! 👋
I’m Masaaki, an independent UI/UX designer and frontend engineer since 2001.
Today, I’m thrilled to introduce KMRVID Skills — a complete 58-skill ecosystem designed to bridge the gap between Figma Design Agent and Claude Code.
Why I built this:
When working with AI design and coding agents, two major problems kept popping up:
Generic "AI Slop": Raw prompts constantly default to centered heroes, identical 2-column layouts, and predictable cream/terracotta palettes.
Broken Handoffs: Design agent outputs are full of messy auto-generated layers (Frame 1234), hardcoded values, and broken auto-layouts that downstream coding agents struggle to parse.
KMRVID Skills solves this by establishing an end-to-end, disciplined pipeline:
In Figma (18 Skills): Auto-audit node readiness, bind variables (Color/Type/Spacing), auto-fix WCAG contrast, and generate Dev Mode annotations directly via Plugin API.
In Claude Code (40 Skills): Zero-prompt project setup, cognitive-UI layout topologies (Z/F/I/Bottom-up), Tailwind-based frontend pipelines, and vision-based alt-text generation.
🎁 Product Hunt Launch Offer (Limited Copies)
We’ve tailored 3 packages depending on your workflow:
All-in-One Complete Bundle (58 Skills): $179 ~~$229~~ (Save $50 / First 50 copies)
👉 https://gaspanik.gumroad.com/l/kmrvid-bundle/phlaunch
KMRVID Claude Skills (40 Skills): $149 ~~$179~~ (Save $30 / First 30 copies)
👉 https://gaspanik.gumroad.com/l/kmrvid-claudeskills/phlaunch
KMRVID Figma Skills (18 Skills): $59 ~~$79~~ (Save $20 / First 30 copies)
👉 https://gaspanik.gumroad.com/l/kmrvid-figmaskills/phlaunch
(Use code PHLAUNCH at checkout or click the links above for automatic early-bird discounts)
I'd love to hear your thoughts, feedback, or any questions about integrating custom skills into your daily workflow! 🚀
🌐 Live Demo & Open Source Preview
Want to see the generated code and live preview before buying?
Live Demo: https://kmrvid-skills-demo.gaspanik.workers.dev
GitHub Repository: https://github.com/gaspanik/kmrvid-skills-demo
GitHub Public Skills Preview: https://github.com/gaspanik?tab=repositories&q=-skill&type=public