accessibility-audit
Run comprehensive accessibility audit (WCAG 2.1) on Webflow pages - checks buttons, forms, links, focus states, headings,…
Create a new CMS collection in Webflow with specified fields and relationships. Use when setting up blog posts, products, team members, portfolios, or other content types with custom fields.
$ npx -y skills add webflow/webflow-skills --skill cms-collection-setup --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
/cms-collection-setupContext preview
The summary Claude sees to decide when to auto-load this skill.
Create a new CMS collection in Webflow with specified fields and relationships. Use when setting up blog posts, products, team members, portfolios, or other content types with custom fields.
name: webflow-mcp:cms-collection-setup description: Create a new CMS collection in Webflow with specified fields and relationships. Use when setting up blog posts, products, team members, portfolios, or other content types with custom fields.
Create a new CMS collection with custom fields, relationships, and proper configuration.
**ALWAYS use Webflow MCP tools for all operations:**
1. **Get site information**: Use Webflow MCP's `data_sites_tool` with action `list_sites` to identify target site 2. **Confirm site**: Ask user to select site if multiple available 3. **Check plan limits**: Use Webflow MCP's `data_sites_tool` with action `get_site` to verify collection limits 4. **List existing collections**: Use Webflow MCP's `data_cms_tool` with action `get_collection_list` to check for conflicts 5. **Validate naming**: Ensure new collection name doesn't conflict with existing
6. **Get collection details**: Ask user for:
7. **Get field definitions**: For each field, gather:
8. **Identify relationships**: Determine if collection needs:
9. **Validate field types**: Check all field types are supported 10. **Check field limits**: Ensure within Webflow limits:
11. **Plan creation order**: Organize fields by dependency:
12. **Generate preview**: Show complete schema with all fields
13. **Show complete preview**: Display:
14. **Validate schema**: Check for common issues:
15. **Request confirmation**: Wait for explicit "create" approval
16. **Create collection**: Use Webflow MCP's `data_cms_tool` with action `create_collection` with:
17. **Capture collection ID**: Save for field creation 18. **Show progress**: Report collection created successfully
19. **Create fields in order**: For each field:
20. **Set field properties**:
21. **Show progress**: Report each field created 22. **Handle errors**: If field creation fails, report and continue
23. **Verify collection**: Use Webflow MCP's `data_cms_tool` with action `get_collection_details` to retrieve full schema 24. **Confirm all fields**: Check that all requested fields were created 25. **Generate report**: Show:
26. **Provide next steps**: Suggest:
**PlainText** - Short text (max 256 chars) or long text
**RichText** - Formatted text with HTML
**Email** - Email address
**Phone** - Phone number
**Link** - Exter
A collection of Agent Skills for working with Webflow sites through the Webflow MCP server. Manage CMS content, audit site health, optimize assets, build in Webflow Designer, create Code Components, run Webflow CLI workflows, and safely publish changes.
Run comprehensive accessibility audit (WCAG 2.1) on Webflow pages - checks buttons, forms, links, focus states, headings,…
Analyze assets on a Webflow site for SEO optimization. Identifies assets missing alt text and assets with non-SEO-friendly names,…
Create or update multiple CMS items in a Webflow collection with validation and diff preview. Use when adding multiple blog…
Create GitHub-source Webflow Cloud apps and monitor, troubleshoot, or manage existing apps through Webflow MCP. Use when creating…
Expert guidance on Webflow CMS architecture and best practices. Use when planning collections, setting up relationships,…
Create and deploy reusable React components for Webflow Designer. Configure existing React projects with webflow.json, build and…