From bricks
Use before writing or editing Bricks element JSON, settings, controls, globals, page settings, or template settings. Gives the runtime lookup order plus bundled full resolved schemas so you can check exact control keys and value shapes instead of guessing.
How this skill is triggered — by the user, by Claude, or both
Slash command
/bricks:element-schemasThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
**Requires:** Bricks 2.4+ with the Abilities API enabled
references/common-elements.mdreferences/schema-manifest.jsonreferences/schema-resolved/README.mdreferences/schema-resolved/controls/align-items.jsonreferences/schema-resolved/controls/audio.jsonreferences/schema-resolved/controls/background.jsonreferences/schema-resolved/controls/border.jsonreferences/schema-resolved/controls/box-shadow.jsonreferences/schema-resolved/controls/button.jsonreferences/schema-resolved/controls/checkbox.jsonreferences/schema-resolved/controls/code.jsonreferences/schema-resolved/controls/color.jsonreferences/schema-resolved/controls/datepicker.jsonreferences/schema-resolved/controls/dimensions.jsonreferences/schema-resolved/controls/direction.jsonreferences/schema-resolved/controls/editor.jsonreferences/schema-resolved/controls/filters.jsonreferences/schema-resolved/controls/icon.jsonreferences/schema-resolved/controls/image-gallery.jsonreferences/schema-resolved/controls/image.jsonRequires: Bricks 2.4+ with the Abilities API enabled
Run first when filesystem tools are available:
_BS_UPDATE_CHECK=""
for _CAND in "$HOME/.bricks/skills/bricks-skills/scripts/bricks-skills-update-check" "$PWD/scripts/bricks-skills-update-check" "$HOME/.claude/skills/bricks-skills/scripts/bricks-skills-update-check" "$HOME/.codex/skills/bricks-skills/scripts/bricks-skills-update-check"; do
[ -f "$_CAND" ] && _BS_UPDATE_CHECK="$_CAND" && break
done
[ -n "$_BS_UPDATE_CHECK" ] && sh "$_BS_UPDATE_CHECK" || true
If it prints BRICKS_SKILLS_UPDATE_AVAILABLE <old> <new> <tag>, load bricks-skills-update before continuing. If it prints BRICKS_SKILLS_JUST_UPDATED <old> <new>, mention the new version and continue.
Use this skill when a write needs exact element keys, control value shapes, CSS-mapped settings, inherited controls, globals, page settings, template settings, or schema validation.
The runtime Bricks MCP and the bundled resolved schemas answer different questions:
image, link, typography, query, repeater, form, interactions, and responsive/pseudo-class setting keys.Use both for non-trivial writes. Runtime first, bundled value schema second.
Bricks element id is an internal builder identifier and is also used in the default frontend selector #brxe-{id}. When you set it yourself, it must be exactly 6 characters. In nested {name, children} input, you may omit ids and Bricks will generate them while preserving parent-child nesting. In flat arrays, provide or preserve valid 6-character ids for every id, parent, and children reference.
Do not use element id for human-readable anchors such as hero or pricing-section. Bricks renders id="brxe-{id}" by default. Only set settings._cssId when you intentionally need a custom HTML id instead of the default Bricks id.
Connected Bricks site: prefer runtime MCP.
bricks-list-element-types.bricks-get-element-schema.ability_name: "bricks/get-element-schema".Bundled full resolved schemas: use the scripts in this skill. The pack includes the resolved schema bundle for elements, controls, global data, page settings, template settings, and general content-area structure.
Local Bricks repo or generated bundle: if you are developing Bricks itself, use the scripts against schema-docs-bundle/schema-resolved or includes/schema to match the checkout exactly.
Academy docs: use deployed schema docs only when the local skill bundle is unavailable or you need to compare against published docs.
Do not load every schema into context. Fetch the one element/control/global schema you need.
Fetch the schema before writing if:
code element or a complex element such as form.For simple repeated builds, default to the small core set in references/common-elements.md, then fetch exact schemas only for the elements and controls you actually use.
From this skill directory:
node scripts/list-schemas.mjs --schema-root /path/to/bricks/schema-docs-bundle/schema-resolved
node scripts/get-schema.mjs element image --schema-root /path/to/bricks/schema-docs-bundle/schema-resolved
node scripts/get-schema.mjs element form --schema-root /path/to/bricks/includes/schema
node scripts/get-schema.mjs element image --compact --settings image,altText,loading
node scripts/get-schema.mjs control image --compact
node scripts/get-schema.mjs general content-area --compact
node scripts/get-schema.mjs element image --list-settings
node scripts/list-schemas.mjs --schema-root references/schema-resolved
node scripts/list-schemas.mjs --common
node scripts/list-schemas.mjs --converter
If --schema-root is omitted, scripts search upward from the current directory for:
schema-docs-bundle/schema-resolvedincludes/schemareferences/schema-resolved inside this skillUse --compact when you need value shapes without loading a full element schema. Use --settings key1,key2 to limit an element schema to the controls you plan to write.
references/schema-manifest.json is a compact discovery manifest generated from the Bricks schema source. Use it to decide what exists and whether an element is common, nestable, WooCommerce-specific, or supported by the HTML-to-Bricks converter.
The manifest is not the schema. Treat it as a map, then fetch the exact schema on demand.
This skill bundles the full resolved schema set. Do not paste the whole bundle into context. Read one element, one control, or one settings file at a time.
Most maintainable Bricks sites use a small set of elements many times:
section, container, block, divheading, text-basic, button, image, iconnav-nested, formPrefer these for new builds unless the user asks for a specific widget or the existing page already uses one. For less-used elements, fetch the schema before editing.
The converter intentionally uses a limited element set. It currently maps to:
section, div, heading, text-basic, text-link, icon, button, image, svg, video, audio, code, divider, form.
Treat converted output as a starting point. If the source implies sliders, accordions, tabs, product widgets, maps, filters, or query-driven cards, convert the static structure first, then replace or refine with the proper Bricks element schema.
id values. Use an exact 6-character internal id, or omit ids only in nested children format. Only set settings._cssId when a custom HTML id is explicitly needed.npx claudepluginhub codeerhq/bricks-skills --plugin bricksGuides creation, editing, and verification of skills for AI coding agents using test-driven development with subagent scenarios. Use when authoring or debugging skills.