Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →graniet/popular-web-designs
54 production-quality design systems extracted from real websites. Load a template to generate HTML/CSS that matches the visual identity of sites like Stripe, Linear, Vercel, Notion, Airbnb, and more. Each template includes colors, typography, components, layout rules, and ready-to-use CSS values.
Passed 15 of 18 test cases with the skill, and 3 of 18 without it.
and 12 more in the full report
14 fixed4 passed either way4 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 14 test cases the skill fixed. Same model, same prompt, with and without the skill.
We are building a landing page for an AI image generation startup with a cinematic dark aesthetic similar to RunwayML. Which template file should be read from the templates directory to obtain its color palette and component specs?
| Checked | Without skill | With skill |
|---|---|---|
| Identifies templates/runwayml.md as the template file | Missed | Passed |
The instructions your model reads when the skill loads.
This skill is repo-local and stays inactive until explicitly activated.
When the original instructions refer to legacy tool names, use these Kheish mappings:
terminal => bashweb_extract => web_fetch, plus web_search when discovery is neededsearch_files => grep_search and glob_searchbrowser_* tools require a browser-capable surfaced tool or MCP; if none is available, use the closest available surface and say so explicitlyWhen the instructions mention local helper files, resolve them from ${KHEISH_SKILL_DIR}.
54 real-world design systems ready for use when generating HTML/CSS. Each template captures a site's complete visual language: color palette, typography hierarchy, component styles, spacing system, shadows, responsive behavior, and practical agent prompts with exact CSS values.
templates/<site>.md from this skill directory with read_filegenerative-widgets skill to serve the result via cloudflared tunnelEach template includes a Kheish Implementation Notes block at the top with:
<link> tag (ready to paste)write_file for HTML creation and browser_vision for verification<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page Title</title>
test cases passed, vs 3 / 18 without
Published skills whose descriptions closely match this one, with their headline benchmark lift.
More skills from the same source and nearby in the registry, with their headline benchmark lift.