divi5-toolkit

Perform a comprehensive CSS audit across all project files. Scores overall Divi 5 compatibility, identifies patterns and anti-patterns, and produces an actionable improvement report with prioritized fixes.

Convert existing CSS to Divi 5-compatible format. Fixes specificity issues, adds proper overrides, handles format wrapping, and supports Divi 4 to Divi 5 migration.

Generate Divi 5-ready CSS for a component, section, or page element. Outputs in the format you specify (Theme Options, Code Module, Child Theme, or Free-Form CSS).

Research the latest Divi 5 updates, features, CSS compatibility changes, and best practices. Updates plugin knowledge base with new findings.

Generate complete Divi 5 page section templates (hero, pricing, testimonials, FAQ, CTA, etc.) with best-practice CSS, responsive design, and accessibility baked in.

Validate CSS for Divi 5 compatibility. Checks for button specificity, selector issues, format correctness, and other common problems. Use ultrathink mode for thorough analysis.

Use this agent when reviewing Divi 5 CSS for accessibility issues. Checks color contrast, focus indicators, touch targets, reduced motion support, semantic elements, and ARIA attribute recommendations. Activates when writing CSS for interactive elements or when the user mentions accessibility, WCAG, ADA, or a11y.

Use this agent when the user pastes Divi error messages, console errors from Divi pages, or describes CSS issues they encountered in Divi 5. Analyzes the error, provides solutions, and updates the plugin's knowledge base to prevent future occurrences.

Use this agent to research the latest Divi 5 updates, features, and compatibility changes. Triggers automatically when plugin knowledge is stale (>7 days since last research) or on-demand when user asks about Divi 5 updates, new features, or compatibility questions.

Use this agent after writing or editing CSS files to validate Divi 5 compatibility. Triggers on CSS file changes and checks for button specificity issues, numbered selectors, missing !important on Divi overrides, and other compatibility problems.

Use this skill when validating CSS for Divi 5 / Divi 5.2 compatibility, checking unsupported features or units, troubleshooting Divi CSS that isn't applying, debugging plugin conflicts (WP Rocket, LiteSpeed, Wordfence, WooCommerce), migrating from Divi 4 to Divi 5, understanding breakpoints, or fixing "styles not working" / "button override not working" / "static CSS cache" issues. Provides compatibility rules, validation patterns, specificity fixes, composable settings alternatives, and a full error-message reference.

Use this skill when writing CSS for Divi 5 / Divi 5.2, styling Divi modules (buttons, sections, rows, blurbs, toggles, forms), working with Free-Form CSS and the `selector` keyword, overriding `.et_pb_*` classes, setting up design tokens or dark mode, adding animations with reduced-motion, styling WooCommerce with Divi, building accessible layouts, or developing a Divi child theme. Provides CSS patterns, class naming conventions, selector specificity guidance, Composable Settings alternatives, Canvas and Loop Builder patterns, and full example files for buttons, design tokens, animations, dark mode, WooCommerce, and accessibility.

1 hook across 1 event