Skip to main content
Glama

Scrape Site Design

kroma_scrape_site_design

Extract design-relevant metadata from any live URL: page title, heading outline, font families, color palette hints, and CSS/utility framework fingerprints. Reverse-engineer the structure and styling of any website.

Instructions

Scrape any live URL and extract design-relevant metadata: page title/description, a heading/typography outline, detected font families, a color-palette hint, and CSS/utility framework fingerprints (Tailwind, Radix, Framer, GSAP, Next.js, etc.). Ideal for reverse-engineering the structure and styling of a site you admire.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
urlYesThe fully-qualified URL to analyze, e.g. 'https://linear.app'.
api_keyNoOptional Serper API key override. Falls back to SERPER_API_KEY env var.
include_rawNoInclude the full raw markdown/text (can be large). Default false — a preview is returned.
include_markdownNoInclude the scraped page content as markdown in the response (default true).
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations, the description carries the transparency burden. It discloses the output metadata types and implies a network scrape, but it does not mention the external Serper API dependency, potential rate limits, or failure modes like blocked sites. The api_key parameter is in the schema but not discussed in the description.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is two sentences, front-loaded with the primary action and a clear list of extracted data. The second sentence adds a concrete use case without any filler. Every clause earns its place, making it concise yet informative.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a scraping tool with no annotations, the description covers purpose, output content, and a use case. It does not mention return format or operational caveats (like API key requirements or blocked URL handling), but the schema partially fills those gaps. It is adequate for an agent to decide whether to use the tool.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The schema covers 100% of parameters with descriptions, so the baseline is 3. The description does not add additional meaning about include_raw/include_markdown defaults or api_key fallback behavior; it only reinforces the core URL analysis purpose. The schema itself does the heavy lifting here.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the tool scrapes any live URL and extracts specific design metadata (title, typography, fonts, colors, framework fingerprints). The verb 'scrape' plus the resource 'live URL' and the explicit output list distinguish it from sibling tools that search or find inspiration.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description explicitly identifies when to use it: 'Ideal for reverse-engineering the structure and styling of a site you admire.' It provides clear context but does not mention alternatives or when not to use it, so it misses a bit of the full guideline picture.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Install Server

Other Tools

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/thatcreativetayo/kromamcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server