Measured design systems decoded from 588 real products, for coding agents.
Abgeleitet aus den Transporten, die dieser Eintrag deklariert (streamable-http). Ein Client, der hier nicht steht, ist damit nicht ausgeschlossen — Forge kann ihn nur nicht bestätigen.
Die Verifizierung bestätigt die Identität des Publishers (die Inhaberschaft am Repo), nicht die Sicherheit des Codes. Der Sicherheits-Scan deckt bekannte CVEs und verdächtige Installationsskripte ab.
Aus einem echten MCP-Handshake initialize → tools/list gegen den deklarierten Endpunkt gelesen. Es wurde nie ein Tool aufgerufen — tools/list ist der lesende Introspektionsaufruf, den das Protokoll dafür vorsieht. Es spiegelt wider, was der Server in diesem Moment angeboten hat; ein gehosteter Endpunkt ist an keine Version gebunden und kann sich ohne Ankündigung ändern.
https://mozaika.design/mcp23 Tools · 807 mssearch_screensSearch real product UI screens for design reference.
Use this BEFORE designing any page/component so your output matches how the
best-designed products actually solve the problem. Returns structured metadata
(description, UX patterns, UI elements, colors, palette) plus an image_url.
Section/co…Search real product UI screens for design reference. Use this BEFORE designing any page/component so your output matches how the best-designed products actually solve the problem. Returns structured metadata (description, UX patterns, UI elements, colors, palette) plus an image_url. Section/co…
| Parameter | Typ | Beschreibung |
|---|---|---|
| query | string | — |
| page_type | string | — |
| ux_pattern | string | — |
| industry | string | — |
| platform | string | — |
| limit | integer | — |
| kind | string | — |
| section_type | string | — |
get_screen_sectionsList the distinct sections of a page (hero, pricing cards, testimonial/feedback,
footer, ...) so you can emulate a specific part. Each section links back to its page
(parent_slug) and the product's design system (call get_design_system(site)).List the distinct sections of a page (hero, pricing cards, testimonial/feedback, footer, ...) so you can emulate a specific part. Each section links back to its page (parent_slug) and the product's design system (call get_design_system(site)).
| Parameter | Typ | Beschreibung |
|---|---|---|
| slug* | string | — |
list_user_flowsList real product user flows (ordered screen journeys) — e.g. signup→dashboard,
browse→checkout. Use to understand how a whole journey is structured before building it.
Returns flow summaries; call get_user_flow(slug) for the full ordered screens.List real product user flows (ordered screen journeys) — e.g. signup→dashboard, browse→checkout. Use to understand how a whole journey is structured before building it. Returns flow summaries; call get_user_flow(slug) for the full ordered screens.
| Parameter | Typ | Beschreibung |
|---|---|---|
| industry | string | — |
| query | string | — |
get_user_flowGet one user flow with its ordered steps, each including full screen metadata and
image_url. Returns an error dict if the flow is not found.Get one user flow with its ordered steps, each including full screen metadata and image_url. Returns an error dict if the flow is not found.
| Parameter | Typ | Beschreibung |
|---|---|---|
| slug* | string | — |
get_screenGet full metadata + image_url for a single screen by slug.Get full metadata + image_url for a single screen by slug.
| Parameter | Typ | Beschreibung |
|---|---|---|
| slug* | string | — |
get_design_systemGet a product's full, LLM-verified design system so you can match its exact look.
Use this for "design like <product>" (e.g. site="Linear", "Stripe", "Figma").
Returns (default): color_scheme; colors with named roles (background, text, primary,
secondary, accent, link, button_bg, button_text);…Get a product's full, LLM-verified design system so you can match its exact look. Use this for "design like <product>" (e.g. site="Linear", "Stripe", "Figma"). Returns (default): color_scheme; colors with named roles (background, text, primary, secondary, accent, link, button_bg, button_text);…
| Parameter | Typ | Beschreibung |
|---|---|---|
| site* | string | — |
| format | string | — |
get_design_historyMeasured design CHANGE HISTORY for a live-decoded domain — the Decode Ledger.
Token-level diffs between deep decodes over time: "radius 4px→8px", "primary hover
#4032C8→#0A2540", "motion dominant 150ms→200ms", each dated. Use it to see how a
product's design system is EVOLVING (no screenshot lib…Measured design CHANGE HISTORY for a live-decoded domain — the Decode Ledger. Token-level diffs between deep decodes over time: "radius 4px→8px", "primary hover #4032C8→#0A2540", "motion dominant 150ms→200ms", each dated. Use it to see how a product's design system is EVOLVING (no screenshot lib…
| Parameter | Typ | Beschreibung |
|---|---|---|
| site* | string | — |
audit_codeWhen the user says a screen looks generic, cheap or off and you need to know WHY —
paste the code and get numbers back. This is the one tool here that reads YOUR work
instead of someone else's product.
Give it the component's CSS, or the JSX/HTML with its class attributes (Tailwind
utilities a…When the user says a screen looks generic, cheap or off and you need to know WHY — paste the code and get numbers back. This is the one tool here that reads YOUR work instead of someone else's product. Give it the component's CSS, or the JSX/HTML with its class attributes (Tailwind utilities a…
| Parameter | Typ | Beschreibung |
|---|---|---|
| code* | string | — |
validate_designGrade YOUR design values against the measured corpus (hundreds of real products,
decoded live — not opinions). Pass whichever metrics you have; each returns its
percentile, the corpus median/p25/p75 and a verdict. Use this to anti-slop-check
your own output BEFORE shipping: "body 13px = p6 (medi…Grade YOUR design values against the measured corpus (hundreds of real products, decoded live — not opinions). Pass whichever metrics you have; each returns its percentile, the corpus median/p25/p75 and a verdict. Use this to anti-slop-check your own output BEFORE shipping: "body 13px = p6 (medi…
| Parameter | Typ | Beschreibung |
|---|---|---|
| body_size_px | number | — |
| hero_size_px | number | — |
| base_unit_px | number | — |
| radius_px | number | — |
| dominant_duration_ms | number | — |
| container_max_width_px | number | — |
| section_rhythm_px | number | — |
get_web_benchmarkThe Measured Web — how the web is ACTUALLY designed, measured live across hundreds of real
products (not opinions): the median design score, border-radius, body/hero font size, colour +
light/dark split, spacing grid, and motion duration. Use it to ground design decisions in real
norms — and whe…The Measured Web — how the web is ACTUALLY designed, measured live across hundreds of real products (not opinions): the median design score, border-radius, body/hero font size, colour + light/dark split, spacing grid, and motion duration. Use it to ground design decisions in real norms — and whe…
Für dieses Tool wurde kein Eingabeschema veröffentlicht.
get_design_driftHas this product's design system CHANGED since it was decoded — and which of its numbers
are safe to hard-code? Mozaika re-measures the most-referenced products from the live DOM
every night and keeps a dated ledger, so this answers what a screenshot never can:
• verdict "held" — nothing moved…Has this product's design system CHANGED since it was decoded — and which of its numbers are safe to hard-code? Mozaika re-measures the most-referenced products from the live DOM every night and keeps a dated ledger, so this answers what a screenshot never can: • verdict "held" — nothing moved…
| Parameter | Typ | Beschreibung |
|---|---|---|
| domain* | string | — |
list_design_changesWhat actually changed in the web's design systems lately — the nightly Drift Ledger feed.
Mozaika re-measures ~100 of the most-referenced products every night and records a dated row
per product even when nothing moved, so this is a real time series, not a guess: how many
products held every tok…What actually changed in the web's design systems lately — the nightly Drift Ledger feed. Mozaika re-measures ~100 of the most-referenced products every night and records a dated row per product even when nothing moved, so this is a real time series, not a guess: how many products held every tok…
| Parameter | Typ | Beschreibung |
|---|---|---|
| limit | integer | — |
get_sectionGet one product's specific section fully specified — its decoded spec + reference
image_url + the parent product's design tokens — in a single call. Use this for
"build a <section> like <product>", e.g. get_section("Linear", "Pricing / Plans").
Deep-decoded products' design_tokens also carry mea…Get one product's specific section fully specified — its decoded spec + reference image_url + the parent product's design tokens — in a single call. Use this for "build a <section> like <product>", e.g. get_section("Linear", "Pricing / Plans"). Deep-decoded products' design_tokens also carry mea…
| Parameter | Typ | Beschreibung |
|---|---|---|
| site* | string | — |
| section_type* | string | — |
compare_sectionsSee how the BEST products each solve the same section — one call, cross-product.
Use before designing any section: e.g. compare_sections("Pricing / Plans") returns a
ranked panel (one per product) of real pricing sections, each with its reference
image_url, pixel-measured spec (bg/text/accents/c…See how the BEST products each solve the same section — one call, cross-product. Use before designing any section: e.g. compare_sections("Pricing / Plans") returns a ranked panel (one per product) of real pricing sections, each with its reference image_url, pixel-measured spec (bg/text/accents/c…
| Parameter | Typ | Beschreibung |
|---|---|---|
| section_type* | string | — |
| industry | string | — |
| scheme | string | — |
| limit | integer | — |
get_componentGet one product's UI component fully specified — its anatomy read from the LIVE DOM
(exact padding / height / border_radius / border / box_shadow / font_weight / letter_spacing /
transition + the real :hover state) plus a reference image_url and the product's design tokens,
in a single call. Use…Get one product's UI component fully specified — its anatomy read from the LIVE DOM (exact padding / height / border_radius / border / box_shadow / font_weight / letter_spacing / transition + the real :hover state) plus a reference image_url and the product's design tokens, in a single call. Use…
| Parameter | Typ | Beschreibung |
|---|---|---|
| site* | string | — |
| component_type* | string | — |
compare_componentsSee how the BEST products each build the same UI atom — one call, cross-product, each
with its anatomy read from the live DOM. Use before building any component:
compare_components("Button") returns a ranked panel (one per product) of real buttons, each
with measured padding / radius / border /…See how the BEST products each build the same UI atom — one call, cross-product, each with its anatomy read from the live DOM. Use before building any component: compare_components("Button") returns a ranked panel (one per product) of real buttons, each with measured padding / radius / border /…
| Parameter | Typ | Beschreibung |
|---|---|---|
| component_type* | string | — |
| industry | string | — |
| scheme | string | — |
| limit | integer | — |
get_recipeThe universal BUILD-KIT fetcher — the measured spec + code to reproduce a piece of UI.
`recipe_type` selects which library across three families (all agent-ready through this one call):
• COMPONENTS (decoded live from a real product's DOM — Mozaika's wedge): "Command Palette",
"Dropdown Menu", "…The universal BUILD-KIT fetcher — the measured spec + code to reproduce a piece of UI. `recipe_type` selects which library across three families (all agent-ready through this one call): • COMPONENTS (decoded live from a real product's DOM — Mozaika's wedge): "Command Palette", "Dropdown Menu", "…
| Parameter | Typ | Beschreibung |
|---|---|---|
| site* | string | — |
| recipe_type* | string | — |
compare_recipesSee how the BEST products each build the same hard pattern — one call, cross-product.
Use before building any complex pattern: compare_recipes("Command Palette") returns a ranked
panel (one per product), each entry carrying the at-a-glance layer you pick a reference by —
overlay radius, whether…See how the BEST products each build the same hard pattern — one call, cross-product. Use before building any complex pattern: compare_recipes("Command Palette") returns a ranked panel (one per product), each entry carrying the at-a-glance layer you pick a reference by — overlay radius, whether…
| Parameter | Typ | Beschreibung |
|---|---|---|
| recipe_type* | string | — |
| industry | string | — |
| scheme | string | — |
| limit | integer | — |
get_productPull an entire product as an agent-ready build kit: the full multi-format design
system (tokens + DESIGN.md/Tailwind/CSS/JSON), every curated page, every section grouped
by type (with spec + image_url), plus any user flows. Deep-decoded products' tokens also
carry measured button states, shadows…Pull an entire product as an agent-ready build kit: the full multi-format design system (tokens + DESIGN.md/Tailwind/CSS/JSON), every curated page, every section grouped by type (with spec + image_url), plus any user flows. Deep-decoded products' tokens also carry measured button states, shadows…
| Parameter | Typ | Beschreibung |
|---|---|---|
| site* | string | — |
list_my_design_systemsList YOUR private design systems (BYODS) — the sites you decoded into your own/your team's
scope. Each item has name + slug; pass the slug/name to get_design_system or get_product to
build against it. Returns an empty list if you have none (or aren't authenticated).List YOUR private design systems (BYODS) — the sites you decoded into your own/your team's scope. Each item has name + slug; pass the slug/name to get_design_system or get_product to build against it. Returns an empty list if you have none (or aren't authenticated).
Für dieses Tool wurde kein Eingabeschema veröffentlicht.
get_asset_packGet a ready-made AI-generated icon pack (12 consistent icons) — e.g. a house style
like 'clay-starter' / 'line-minimal-starter', or a pack generated in the MEASURED style
of a decoded brand. Free and unmetered. Each image is a 1024px transparent PNG you can
download and use directly (full commer…Get a ready-made AI-generated icon pack (12 consistent icons) — e.g. a house style like 'clay-starter' / 'line-minimal-starter', or a pack generated in the MEASURED style of a decoded brand. Free and unmetered. Each image is a 1024px transparent PNG you can download and use directly (full commer…
| Parameter | Typ | Beschreibung |
|---|---|---|
| slug* | string | — |
generate_assetGenerate ON-BRAND icons with AI: subjects (1-12 short nouns, e.g. ["settings gear",
"credit card"]) rendered in ONE consistent style. style_from is either a decoded domain
("stripe.com" — the icons match that brand's MEASURED style: accents, stroke, corners)
or a house style key ("skeuomorph").…Generate ON-BRAND icons with AI: subjects (1-12 short nouns, e.g. ["settings gear", "credit card"]) rendered in ONE consistent style. style_from is either a decoded domain ("stripe.com" — the icons match that brand's MEASURED style: accents, stroke, corners) or a house style key ("skeuomorph").…
| Parameter | Typ | Beschreibung |
|---|---|---|
| subjects* | array | — |
| style_from* | string | — |
| format | string | — |
get_scoreDesign Score: a 0-100 design audit MEASURED from the site's live DOM (real WCAG
contrast pairs, detected type ladder, spacing grid, forced hover states, motion) —
scored against the whole measured-web corpus ("top N% of M systems"). Free to read.
Use it to audit the site YOU are building or any…Design Score: a 0-100 design audit MEASURED from the site's live DOM (real WCAG contrast pairs, detected type ladder, spacing grid, forced hover states, motion) — scored against the whole measured-web corpus ("top N% of M systems"). Free to read. Use it to audit the site YOU are building or any…
| Parameter | Typ | Beschreibung |
|---|---|---|
| site* | string | — |
| refresh | boolean | — |
23 von 23 Tools haben eine Beschreibung veröffentlicht.
Tool-Namen und -Beschreibungen stammen vom Publisher und werden wortgetreu als inerter Text angezeigt. Es sind die Zeichenketten, die ein MCP-Client an ein Modell übergibt, deshalb prüft Forge sie auf Prompt-Injection-Muster — jeder Befund erscheint oben beim Sicherheits-Scan. „Privilegiert“ ist ein Schlagwort-Treffer im Tool-Namen, keine Prüfung dessen, was das Tool tut: ein harmlos klingender Name kann trotzdem alles tun.
Measured design systems decoded from 588 real products, for coding agents.
Verlinkte Namen öffnen den Forge-Index aller Einträge, bei denen dieses Tool beobachtet wurde. Alle indexierten Tools durchsuchen.
Dieser Eintrag veröffentlicht kein npm-Paket, daher hat Forge keinen Abhängigkeitsbaum dafür. Das ist eine Lücke in der Abdeckung — keine Aussage, dass er keine Abhängigkeiten hat.