visualize is a skill that stops AI-generated HTML looking agent-made — replacing Inter-and-purple-gradient defaults with on-brand, distinctive output.
AIOpen SourceWeb+1
github.comLoading resources…
KyrieCheungYep/ky-design-to-html-skill
github.com
A Claude and Codex skill for turning UI screenshots and design mockups into faithful HTML/CSS, with asset separation and screenshot-based verification.
What is KyrieCheungYep/ky-design-to-html-skill?
KY Design to HTML Skill targets the gap between 'AI, turn this screenshot into HTML' and a result that actually holds up. It focuses on reproducing existing UI — landing pages, SaaS dashboards, empty states — rather than generating new designs, with emphasis on asset separation, canvas adaptation and avoiding squeezed layouts or distorted assets. Screenshot verification and visual error correction let the agent compare its output against the original and fix drift.
Best for
- Reproducing UI screenshots as clean HTML/CSS
- Static pages from landing page mockups
- Fixing AI layouts that drift from the design
Key features
- Screenshot-to-HTML/CSS reproduction workflow
- Asset separation and canvas adaptation
- Screenshot verification with error correction
- Works with Claude Code and Codex
Related resources
github.com
Anthony Fu's collection of Agent Skills, encoding his preferences, experience, and best practices — generated from source docs and kept in sync.
AIOpen SourceWeb
github.com
Garry Tan's Claude Code workflow stack — slash commands for office hours, CEO-level plan review, rigorous code review, QA and release automation.
AIOpen SourceWeb
github.com