Sekkei – Section Planner & Workflow Toolkit for Elementor

Sekkei (設計, Japanese for “design/planning”) is the all-in-one workflow companion built specifically for Elementor developers and agencies. It integrates directly into the Elementor editor as a draggable floating panel, or works as a standalone tool from your WordPress dashboard.

Stop switching between apps and browser tabs — plan, audit, collaborate, and hand off everything in one place, right next to your Elementor canvas.

Key Features Section Planner — Plan your page structure before building. Add sections with names, types, CSS classes, notes, dependencies, and health warnings. Sync Elementor containers, export a clean page outline for client approval, and track responsive QA status (desktop/tablet/mobile) per section.

Design Checklist — Never miss a step. 30+ checklist items across 5 categories with accordion collapse. Load SOP templates for Landing Pages, WooCommerce, or Blog layouts. Add custom items and groups. Track progress with a live progress bar.

Color Palette — Save and organize brand colors. Group colors by palette (Brand, Dark Mode, etc.). Assign roles like Primary, Accent, Background. Copy hex codes, CSS variables, or push colors directly to Elementor Global Colors.

Font Pairing — Curated font pairings including Bengali and Arabic presets. Filter by style: editorial, modern, minimal, bold. Copy CSS, Google Fonts links, or CSS Custom Properties. Save custom pairings with weight/line-height recommendations.

Design Tokens — Generate CSS custom property tokens for typography scale, spacing, border radius, and box shadows. Copy as a :root {} block into your stylesheet. Sync tokens directly to Elementor Global Styles (writes to Elementor Kit).

CSS Generator — Generate Elementor-ready CSS snippets from 6 presets, and manage all your styles in one place with the Scattered Custom CSS Hub. Scan the page to edit and update Elementor custom CSS on any widget or container from a single panel.