Name: webiny-website-builder
Rating: 70.39999999999999 (1 reviews)
Author: webiny

webiny-website-builder

Building Website Builder editor components, theming, and CMS integration using @webiny/website-builder-nextjs. Use this skill when the developer wants to create editor components for the Website Builder, register components with createComponent, define configurable inputs (text, number, boolean, color, select, file/image, slot, lexical, object, tags), type the component's props correctly (especially file/image inputs, which are objects with { src, width, height, ... } and NOT plain strings, and lexical inputs which are { html, state } objects), set up component groups, customize the theme (CSS variables, createTheme, Tailwind bridge, fonts), build Server Components that fetch CMS data, or understand the WB architecture (Admin iframe + Next.js). Also use for anything related to the Website Builder starter kit.

Quality

85%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Low

Low-risk findings worth noting

Quality

Content

78%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A highly actionable, mostly concise SDK reference with executable examples and a critical typing pitfall surfaced, but it is a single large file with no bundle references split out, limiting progressive disclosure.

Suggestions

Move the detailed prop-type / input-factory reference tables and the full theme.css/theme.ts/tailwind.css listings into a references/ file (e.g. INPUT_TYPES.md, THEME.md) and link to them from SKILL.md to improve progressive disclosure.

Add an explicit end-to-end 'getting started' workflow (clone starter → set env vars → register first component → register groups → wire theme) as a short numbered sequence to strengthen workflow clarity.

Trim the worked FeatureCard example or move it to an examples reference to reduce the inline footprint of the body.

Dimension	Reasoning	Score
Conciseness	Mostly lean and high-signal — input factory table, prop-type table, and code examples assume Claude knows React/Next.js with little padding — but at ~450 lines some sections (full prop-type table, complete theme.css/theme.ts/tailwind.css listings) could be externalized to trim the body.	4 / 5
Actionability	Fully executable, copy-paste-ready examples for components, registration, groups, all three theme files, and a Server Component using real SDK calls (sdk.cms.listEntries, result.isOk()), plus the critical file/image-object typing pitfall covered explicitly.	5 / 5
Workflow Clarity	Reference-style skill with a clear 4-file font-change checklist and a data-flow diagram; no destructive/batch validation is required so the cap does not apply, though initial setup lacks an explicit end-to-end sequenced workflow.	4 / 5
Progressive Disclosure	No bundle files exist (references/scripts/assets absent) and SKILL.md is monolithic — the full input-type/prop-type tables and complete theme setup are inlined rather than split into one-level-deep reference files, though section headers and cross-skill links provide some structure.	3 / 5
	Total	16 / 20 Passed

Description

92%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A specific, well-triggered description with comprehensive concrete actions and an explicit 'Use when...' clause, clearly distinguishable from sibling Webiny skills. Only minor room to add plainer user-facing trigger synonyms.

Dimension	Reasoning	Score
Specificity	Lists multiple concrete actions — 'register components with createComponent', 'define configurable inputs (text, number, boolean, color, select, file/image, slot, lexical, object, tags)', 'customize the theme (CSS variables, createTheme, Tailwind bridge, fonts)', 'build Server Components that fetch CMS data' — with comprehensive coverage.	5 / 5
Completeness	Explicitly answers both what ('Building Website Builder editor components, theming, and CMS integration') and when ('Use this skill when the developer wants to create editor components...' and 'Also use for anything related to the Website Builder starter kit').	5 / 5
Trigger Term Quality	Strong keyword coverage of SDK-specific terms (createComponent, createTheme, Tailwind bridge, lexical/file inputs, Server Components, CMS data) plus natural phrasing like 'when the developer wants to create editor components', but a few plain-user synonyms are absent and coverage leans technical.	4 / 5
Distinctiveness Conflict Risk	Targets a clear niche (@webiny/website-builder-nextjs / Website Builder) and explicitly scopes away from the related webiny-sdk and webiny-project-structure skills, giving minimal conflict risk.	5 / 5
	Total	19 / 20 Passed

Validation

100%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository: webiny/webiny-js
Path: skills/user-skills/website-builder/SKILL.md
Commit: d98a4e8

Reviewed: 4 days ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.