Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →Analyze websites for design inspiration, extracting colors, typography, layouts, and patterns. Use when you have specific URLs to analyze for a design project.
.claude/skills/davepoon-inspiration-analyzer/SKILL.md| Test case | Without → With | Effect | Δ tokens | Δ turns |
|---|---|---|---|---|
| case-18 | ✗→✓ | ▲ Improved | 35% | 0% |
| case-07 | ✗→✓ | ▲ Improved | -9% | 0% |
| case-09 | ✗→✓ | ▲ Improved | 4% | 0% |
| case-19 | ✗→✓ | ▲ Improved | 1% | 0% |
| case-20 | ✗→✓ | ▲ Improved | -21% | 0% |
Analyze websites to extract design inspiration including colors, typography, layouts, and UI patterns.
When a user provides inspiration URLs, this skill:
javascript// Get or create browser tab tabs_context_mcp({ createIfEmpty: true }) tabs_create_mcp()
javascriptnavigate({ url: "https://example.com", tabId: tabId })
Take multiple screenshots to capture the full experience:
javascript// Full page screenshot computer({ action: "screenshot", tabId: tabId }) // Scroll and capture more computer({ action: "scroll", scroll_direction: "down", tabId: tabId }) computer({ action: "screenshot", tabId: tabId }) // Mobile view resize_window({ width: 375, height: 812, tabId: tabId }) computer({ action: "screenshot", tabId: tabId })
From screenshots and page content, extract:
Note hex codes where visible.
Create a structured analysis:
markdown## Website Analysis: [URL] ### Screenshots [Describe key screenshots taken] ### Color Palette | Role | Hex | Usage | |------|-----|-------| | Primary | #xxx | [Where used] | | Secondary | #xxx | [Where used] | | Background | #xxx | [Where used] | | Text | #xxx | [Where used] | | Accent | #xxx | [Where used] | ### Typography - **Headlines**: [Font name/description] - [weight] - **Body**: [Font name/description] - [weight] - **Scale**: [Size relationships] - **Line height**: [Observation] ### Layout Patterns - Grid: [Description] - Spacing: [Description] - Sections: [Description] ### UI Elements - **Buttons**: [Description] - **Cards**: [Description] - **Navigation**: [Description] - **Footer**: [Description] ### Key Takeaways 1. [What makes this design distinctive] 2. [Pattern worth replicating] 3. [Specific technique to use] ### What to Avoid - [Any patterns from this site that are overused] - [Elements that wouldn't translate well]
When analyzing multiple URLs:
If browser tools are unavailable:
The analysis should provide:
See references/extraction-techniques.md for detailed extraction methods.
| Case | Status | Duration (ms) | Turns | Tokens | Tool calls | ||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Without | With | Δ | Without | With | Δ | Without | With | Δ | Without | With | Δ | ||
case-01 | fail→fail | 23,388 | 3,814 | -84% | 1 | 1 | 0% | 4,713 | 1,516 | -68% | 0 | 0 | — |
case-13 | pass→pass | 5,497 | 5,775 | +5% | 1 | 1 | 0% | 955 | 2,245 | +135% | 0 | 0 | — |
case-18 | fail→pass | 10,143 | 5,924 | -42% | 1 | 1 | 0% | 1,611 | 2,167 | +35% | 0 | 0 | — |
case-02 | fail→fail | 23,983 | 3,917 | -84% | 1 | 1 | 0% | 4,294 | 1,479 | -66% | 0 | 0 | — |
case-03 | fail→fail | 30,290 | 3,348 | -89% | 1 | 1 | 0% | 6,092 | 1,491 | -76% | 0 | 0 | — |
case-04 | pass→pass | 6,814 | 6,896 | +1% | 1 | 1 | 0% | 1,380 | 2,684 | +94% | 0 | 0 | — |
case-05 | pass→pass | 8,821 | 8,106 | -8% | 1 | 1 | 0% | 1,648 | 2,701 | +64% | 0 | 0 | — |
case-06 | pass→pass | 5,330 | 3,362 | -37% | 1 | 1 | 0% | 1,111 | 1,869 | +68% | 0 | 0 | — |
case-12 | fail→fail | 13,557 | 8,849 | -35% | 1 | 1 | 0% | 2,219 | 2,658 | +20% | 0 | 0 | — |
case-07 | fail→pass | 10,834 | 3,451 | -68% | 1 | 1 | 0% | 1,951 | 1,769 | -9% | 0 | 0 | — |
case-08 | pass→pass | 8,852 | 2,523 | -71% | 1 | 1 | 0% | 1,591 | 1,574 | -1% | 0 | 0 | — |
case-09 | fail→pass | 7,598 | 1,679 | -78% | 1 | 1 | 0% | 1,339 | 1,395 | +4% | 0 | 0 | — |
case-10 | fail→fail | 6,682 | 2,070 | -69% | 1 | 1 | 0% | 1,110 | 1,459 | +31% | 0 | 0 | — |
case-11 | pass→pass | 6,889 | 3,043 | -56% | 1 | 1 | 0% | 1,217 | 1,651 | +36% | 0 | 0 | — |
case-14 | pass→pass | 13,062 | 7,837 | -40% | 1 | 1 | 0% | 2,345 | 2,596 | +11% | 0 | 0 | — |
case-15 | pass→pass | 5,746 | 2,605 | -55% | 1 | 1 | 0% | 941 | 1,563 | +66% | 0 | 0 | — |
case-16 | pass→pass | 8,111 | 2,397 | -70% | 1 | 1 | 0% | 1,336 | 1,532 | +15% | 0 | 0 | — |
case-17 | pass→pass | 14,851 | 9,397 | -37% | 1 | 1 | 0% | 2,688 | 2,801 | +4% | 0 | 0 | — |
case-19 | fail→pass | 9,246 | 2,633 | -72% | 1 | 1 | 0% | 1,652 | 1,676 | +1% | 0 | 0 | — |
case-20 | fail→pass | 9,498 | 1,250 | -87% | 1 | 1 | 0% | 1,689 | 1,340 | -21% | 0 | 0 | — |
case-21 | fail→pass | 6,302 | 1,096 | -83% | 1 | 1 | 0% | 1,056 | 1,293 | +22% | 0 | 0 | — |
case-22 | pass→pass | 14,216 | 9,964 | -30% | 1 | 1 | 0% | 2,625 | 2,973 | +13% | 0 | 0 | — |
case-23 | pass→pass | 15,393 | 9,988 | -35% | 1 | 1 | 0% | 2,728 | 2,878 | +5% | 0 | 0 | — |
DecimalAI ran this skill against gemini-3.6-flash twice over the same eval suite — once with the skill loaded and once without — and compared the two runs case by case. 23 cases were attempted, and 20 counted toward the lift figure. The other 3 produced results that are not comparable between the two arms, so they are excluded from the headline rather than averaged into it. The headline lift of +26 percentage points is the difference between those two pass rates over the 20 comparable cases. 2 cases got worse with the skill loaded, and they are included in that figure.
Without the skill loaded, the model failed this case. With it loaded, the same prompt on the same model passed. This is one improved case from the latest verified run; every case, including any that regressed, is in the table above.
Other measured skills in the registry, with their headline benchmark lift.