Skip to content

AI-Native Block System for WordPress

Build WordPress with AI.
Keep it clean.

The AI-native block system for WordPress. 34 patterns, design tokens via theme.json, 6 style variations. Zero lock-in โ€” everything AI generates stays editable in the Site Editor.

Free forever ยท No credit card ยท Works with Claude, ChatGPT, Cursor

โ— โ— โ—   editnative.com

theme.json

Design tokens control everything

๐ŸŽจ

14 color tokens

๐Ÿ“

Fluid spacing

โœ๏ธ

Site Editor ready

Works with your favorite AI tools

๐Ÿค–

Claude

๐Ÿ’ฌ

ChatGPT

โŒจ๏ธ

Cursor

๐Ÿงฉ

Copilot

๐ŸŒ

WordPress 6.6+

Why EditNative

AI makes building fast. EditNative makes it last.

You ask ChatGPT to build a WordPress page. It looks fine. Then you try to edit it in the Site Editor โ€” and nothing works. Colors are hardcoded. Spacing is random. Every section is slightly different. EditNative fixes this at the source: a design token system that makes AI output consistent, clean, and actually editable.

The problem we solve

AI builds fast. But the mess stays forever.

Without EditNative

  • Inline styles everywhere
  • Hardcoded colors and spacing
  • Can’t edit in Site Editor
  • Every page looks slightly different
  • Plugin conflicts and bloat
  • Breaks on theme updates
  • Client calls you to fix everything

With EditNative

  • Design tokens from theme.json
  • Consistent spacing and colors
  • Fully editable in Site Editor
  • Every page follows the system
  • Zero plugin dependencies
  • Native blocks survive any update
  • Client edits content independently

How it works

AI builds it. WordPress keeps it.

No setup wizard. No configuration. Just three steps.

01

Install the theme

Download the zip, upload it to WordPress, hit activate. That’s it. You get patterns, templates, design tokens, and the AI prompt pack immediately.

02

Generate with AI

Open your AI tool. Paste the prompt pack instructions. Ask it to build a landing page, about page, whatever you need. It outputs clean WordPress blocks instead of the usual mess.

03

Edit natively

Open the page in the WordPress Site Editor. Move blocks around, change text, swap colors. It all works because there’s nothing proprietary โ€” just native WordPress blocks.

Features

What you actually get

One theme zip. No plugins to install. No setup wizard. Just activate and go.

๐ŸŽจ

34 Block Patterns

Hero sections, feature grids, pricing tables, FAQ accordions, testimonials, contact forms. Built with native blocks โ€” not shortcodes that break when you switch themes.

โš™๏ธ

Design Token System

14 colors, 9 spacing sizes, fluid typography. All in theme.json. Change your brand color once โ€” every pattern, every page updates automatically.

๐Ÿค–

AI Prompt Pack

Copy-paste instructions that tell Claude, ChatGPT, or Cursor exactly how to generate pages using your theme’s tokens. The AI output actually matches your design system.

๐ŸŽญ

6 Style Variations

Default, Dark, Warm, Ocean, Forest, and Minimal. Switch your entire look in one click from the Site Editor.

โšก

Zero Bloat

Zero JavaScript on the frontend. No jQuery, no CSS frameworks, no plugin dependencies. Your PageSpeed score stays high because there’s nothing to slow it down.

๐Ÿ›ก๏ธ

No Lock-In

Switch to a different theme tomorrow โ€” your content stays. No shortcodes that turn into garbage, no proprietary blocks that disappear. It’s just WordPress.

One source of truth

theme.json controls everything

Colors, spacing, typography, layout widths โ€” defined once in theme.json. Every pattern, template, and AI-generated page uses the same tokens. Change a color in one place, and your entire site updates.

No more hunting through CSS files. No more inconsistent pages. One system, one source of truth.

{
  "settings": {
    "color": {
      "palette": [
        { "slug": "accent",
          "color": "#2563eb" },
        { "slug": "primary",
          "color": "#1e3a5f" }
      ]
    },
    "typography": {
      "fluid": true,
      "fontSizes": [
        { "slug": "large",
          "size": "1.25rem",
          "fluid": { "min": "1.1rem",
                     "max": "1.25rem" }}
      ]
    },
    "spacing": {
      "spacingSizes": [
        { "slug": "80",
          "size": "clamp(3.5rem,
                   2rem + 3.75vw,
                   6rem)" }
      ]
    }
  }
}

How we compare

Not another page builder.

EditNative is fundamentally different from AI page builders.

EditNative10WebElementor AIDivi AI
Native block output
Site Editor compatible
No builder lock-in
Self-hosted
AI prompt system
theme.json design tokens
WP 7.0 AI compatible
Starting priceFree$10/mo$132/yr$277/yr

34

Block Patterns

6

Style Variations

0

Plugin Dependencies

100%

Native WordPress

Built for

People who are tired of cleaning up after AI

๐Ÿ‘ฉโ€๐Ÿ’ป

Freelancers

You’re building 3-4 client sites a month. AI speeds up the build, but then you spend hours fixing inline styles and broken layouts. EditNative means the AI output is clean from the start โ€” and your clients can edit it without calling you every week.

๐Ÿข

Small Agencies

Every developer on your team builds things slightly differently. One uses custom CSS, another hardcodes spacing. EditNative gives everyone the same system โ€” same tokens, same patterns, same structure. Projects ship faster and actually look consistent.

๐Ÿš€

Founders & Marketers

You don’t want to learn Elementor. You don’t want to hire a developer for every text change. You just want a good-looking site you can actually update yourself. AI builds the pages, EditNative makes sure they stay editable.

Pricing

Free to start. $5/mo if you want more.

Most people stick with Free. Pro is there when you outgrow it.

Free

$0

free forever โ€” no credit card


  • 34 block patterns
  • All page templates
  • AI prompt pack
  • Design token system
  • 6 style variations
  • Community support

Most Popular

Pro

$5/mo

or $49/year โ€” save 18%


  • Everything in Free, plus:
  • Premium style variations
  • Brand Config plugin
  • Priority email support
  • Monthly new patterns
  • White-label rights

๐Ÿ”’ Secure checkout ยท 14-day money-back guarantee ยท Cancel anytime

FAQ

Frequently Asked Questions

Everything you need to know before getting started.

What exactly is EditNative Starter?

EditNative Starter is a WordPress block theme โ€” a .zip file you upload to your WordPress site. It includes 34 patterns, design tokens via theme.json, page templates, and an AI prompt pack that teaches AI tools to generate clean WordPress blocks. No plugins required.

Is the free version actually free? What’s the catch?

Truly free, forever. The free version includes all 34 patterns, all templates, the design token system, the AI prompt pack, and all 6 style variations. No credit card, no trial period, no nag screens. Pro adds premium style variations, Brand Config plugin, white-label rights, and priority support for $5/mo.

Which AI tools does this work with?

Any AI tool that can generate text or code: Claude, ChatGPT, Cursor, GitHub Copilot, Codex, and others. The AI prompt pack includes pre-written instructions that teach these tools to output clean WordPress block markup that matches the EditNative design system.

Will this break my existing WordPress site?

No. EditNative uses 100% native WordPress blocks. It has zero plugin dependencies and doesn’t modify your database. If you switch to another theme, all your content stays intact. It’s the opposite of lock-in.

How is this different from Elementor, Divi, or other page builders?

Page builders create proprietary markup that only works inside their ecosystem. EditNative uses native WordPress blocks โ€” the same system WordPress itself uses. Your content stays clean, portable, and editable in the standard WordPress Site Editor. No builder plugin required.

Can my clients edit the site themselves?

Yes โ€” that’s the whole point. Because everything is native WordPress blocks, your clients can change text, images, colors, and layout in the standard WordPress editor. No special training needed, no extra plugins to learn.

What WordPress version do I need?

WordPress 6.6 or later. The theme uses theme.json version 3 and modern block features. PHP 7.4+ is required.

Set Up Your Site in One Prompt

Copy this prompt into Claude, ChatGPT, or Cursor. Fill in your site brief at the top โ€” the AI will automatically pick the best style, patterns, and content for your business.

You are building a WordPress website using the EditNative Starter theme (and optionally the EditNative Code companion plugin). EditNative is the AI-native block system for WordPress โ€” native blocks only, design tokens via theme.json, 34 patterns, 6 style variations, zero plugin dependencies, zero lock-in. Everything you generate stays editable in the Site Editor. Read the brief below, then build the site. โ•โ•โ• MY SITE BRIEF (fill in before copying) โ•โ•โ• Site URL: [your-domain.com] Business type: [e.g., freelance photographer, SaaS product, local bakery, personal blog, nonprofit, agency] Pages I need: [e.g., Home, About, Services, Portfolio, Contact, Blog, Pricing] Brand feel: [e.g., professional, warm & friendly, bold & modern, minimal & clean, natural & earthy] Color preference: [e.g., blue, teal, earth tones, black & white, green, or “no preference”] Key content: [e.g., client testimonials, pricing tiers, team members, project gallery, blog posts, FAQ] EditNative Code plugin installed? [yes/no] Analytics IDs (if plugin installed): [Clarity ID / GA4 ID / GTM ID, or “none yet”] โ•โ•โ• INSTALL (if not already done) โ•โ•โ• Theme: Download from https://editnative.com/?editnative-download=1 โ†’ WP admin โ†’ Appearance โ†’ Themes โ†’ Add New โ†’ Upload Theme โ†’ Activate. Plugin (optional): Download from https://editnative.com/?editnative-download=plugin โ†’ WP admin โ†’ Plugins โ†’ Add New โ†’ Upload Plugin โ†’ Activate. Then: Settings โ†’ General (title/tagline), Permalinks (select “Post name”), Reading (static homepage or latest posts). If you have browser automation (Chrome MCP), navigate to https://editnative.com, click “Download Free”, then upload via [SITE-URL]/wp-admin/theme-install.php. For the plugin, download from the URL above and upload via [SITE-URL]/wp-admin/plugin-install.php. โ•โ•โ• STYLE VARIATIONS โ€” pick one based on my brief โ•โ•โ• Default โ€” Professional blue โ€” Primary #1e3a5f, Accent #2563eb โ€” Best for: corporate, SaaS, professional services Dark โ€” Dark mode โ€” Base #1C1917, Primary #0f172a, Accent #60a5fa โ€” Best for: tech, creative, portfolio, dev tools Warm โ€” Earthy, inviting โ€” Primary #78350f, Accent #b45309 โ€” Best for: food, wellness, crafts, hospitality Ocean โ€” Fresh, coastal โ€” Primary #0f766e, Accent #0e7490 โ€” Best for: health, environment, travel, education Forest โ€” Natural, grounded โ€” Primary #166534, Accent #15803d โ€” Best for: outdoors, sustainability, agriculture Minimal โ€” Black & white โ€” Primary #171717, Accent #525252 โ€” Best for: editorial, luxury, architecture, typography Based on my brand feel and color preference, recommend the best variation. Apply via: Appearance โ†’ Editor โ†’ Styles โ†’ Browse Styles. โ•โ•โ• PATTERN CATALOG โ€” use these to build pages โ•โ•โ• Insert patterns via: Edit page โ†’ + inserter โ†’ Patterns โ†’ EditNative categories. Or in Code Editor: <!– wp:pattern {“slug”:”editnative/hero”} /–> FULL-PAGE PATTERNS (compose an entire page instantly): โ€ข page-landing โ€” Hero + features + stats + testimonials + FAQ + CTA. Use as homepage. โ€ข page-about โ€” Story + stats + team + testimonials + CTA. Use for About pages. โ€ข page-services โ€” Hero + services grid + pricing + FAQ + CTA. Use for Services pages. โ€ข page-portfolio โ€” Gallery + stats + testimonials. Use for Portfolio pages. โ€ข page-contact โ€” Contact form + details + FAQ. Use for Contact pages. โ€ข page-features โ€” Feature showcase with grid and list layouts. โ€ข page-getting-started โ€” Step-by-step onboarding/documentation page. โ€ข page-comparison โ€” Side-by-side comparison + table + FAQ. Use for SEO comparison pages. SECTION PATTERNS (mix and match to compose custom pages): Heroes (page openers): โ€ข hero โ€” Full-width dark background, large heading, dual CTAs, browser mockup. Best first section. โ€ข hero-minimal โ€” Clean white background, heading + subtitle + single CTA. Best for interior pages. โ€ข intro-text โ€” Centered intro paragraph. Subtle opener or section transition. Features & benefits: โ€ข feature-grid โ€” 3 emoji-icon cards on secondary background. Highlight 3 key benefits. โ€ข features-list โ€” 2-column checklist format. Detailed feature lists. โ€ข content-split โ€” Text + image two-column layout. Explain a concept visually. โ€ข how-it-works โ€” Numbered step-by-step process. Show a workflow. Social proof & credibility: โ€ข testimonials โ€” 3 client quote cards. โ€ข stats โ€” 4-number statistics row on dark background. โ€ข logo-cloud โ€” “Trusted by” partner/client name row. โ€ข team โ€” Team member cards with emoji avatars. Conversion: โ€ข pricing-cards โ€” Tiered pricing table (Free/Pro/Agency). โ€ข cta-band โ€” Full-width accent-colored call to action. Mid-page conversion. โ€ข cta-centered โ€” Centered CTA on white background. Soft conversion nudge. โ€ข footer-cta โ€” Pre-footer CTA on dark background. Final section before footer. โ€ข newsletter โ€” Email signup section. Comparison: โ€ข before-after โ€” Two-column before/after comparison. โ€ข comparison-table โ€” Feature comparison matrix vs competitors. Content: โ€ข services-list โ€” 2-column service offerings grid. โ€ข gallery โ€” 3-column project showcase grid. โ€ข latest-posts โ€” 3-column blog post grid. โ€ข faq-accordion โ€” Expandable Q&A using details/summary blocks. โ€ข contact-form-section โ€” Form placeholder with heading. โ€ข contact-details โ€” Address, phone, email, hours. All slugs use “editnative/” prefix (e.g., editnative/hero, editnative/pricing-cards). โ•โ•โ• BLOCK MARKUP RULES โ•โ•โ• DO: โœ“ Native WordPress core blocks only โœ“ Colors by slug: “backgroundColor”:”primary” (never hex) โœ“ Spacing by preset: “padding”:{“top”:”var:preset|spacing|80″} (never pixels) โœ“ Font sizes by preset: “fontSize”:”xx-large” โœ“ Every section: align:full group โ†’ constrained inner layout โ†’ spacing|80 top/bottom, spacing|50 left/right โœ“ Alternate backgrounds: base โ†’ secondary โ†’ base โ†’ primary โœ“ Heading hierarchy: h1 โ†’ h2 โ†’ h3 (never skip) NEVER: โœ— Tailwind classes, custom CSS, shortcodes, page builder markup โœ— Hardcoded hex colors or pixel spacing โœ— More than 3 group nesting levels โœ— Inline <style> or <script> tags โœ— Classic editor block SECTION WRAPPER (use for every section): <!– wp:group {“align”:”full”,”style”:{“spacing”:{“padding”:{“top”:”var:preset|spacing|80″,”bottom”:”var:preset|spacing|80″,”left”:”var:preset|spacing|50″,”right”:”var:preset|spacing|50″}}},”backgroundColor”:”secondary”,”layout”:{“type”:”constrained”}} –> <div class=”wp-block-group alignfull has-secondary-background-color has-background” style=”padding-top:var(–wp–preset–spacing–80);padding-right:var(–wp–preset–spacing–50);padding-bottom:var(–wp–preset–spacing–80);padding-left:var(–wp–preset–spacing–50)”> [content blocks here] </div> <!– /wp:group –> BUTTON: <!– wp:button {“style”:{“border”:{“radius”:”6px”}}} –> <div class=”wp-block-button”><a class=”wp-block-button__link wp-element-button” style=”border-radius:6px”>Button Text</a></div> <!– /wp:button –> DESIGN TOKENS: Colors: base, contrast, primary, primary-dark, accent, accent-dark, secondary, secondary-dark, surface, neutral, neutral-dark, border, primary-text (text on dark bg), primary-muted (captions on dark bg) Spacing: 10 (0.25rem), 20 (0.5rem), 30 (0.75rem), 40 (1rem), 50 (1.5rem), 60-90 (fluid 2-8rem) Font sizes: x-small, small, medium, large, x-large, xx-large, xxx-large (large+ are fluid) Shadows: sm, md, lg. Layout: contentSize 720px, wideSize 1180px. โ•โ•โ• EDITNATIVE CODE PLUGIN (skip if not installed) โ•โ•โ• If the plugin is installed, configure these features via Appearance โ†’ EditNative Code: Custom CSS: CSS tab has pre-filled design token overrides (commented out). Uncomment and edit to override style variation colors. WARNING: an active :root block in CSS overrides ALL style variations. Custom JS: JS tab, disabled by default. Toggle to enable. Runs after DOMContentLoaded. Custom PHP: PHP tab, disabled by default. Pre-filled snippets for removing WP version, disabling XML-RPC, custom image sizes. Brand Config: Appearance โ†’ Brand Config. Export/import JSON with design tokens (colors + border radii) for multi-site consistency. Analytics: Under Cookie Consent settings, paste Clarity ID, GA4 Measurement ID, or GTM Container ID. Auto-injects tracking with consent handling. SEO: Auto-generates meta descriptions, Open Graph tags, and JSON-LD structured data (WebSite, WebPage, Article). No config needed for defaults. โ•โ•โ• SAFETY RULES โ•โ•โ• โš  NEVER modify template parts (header/footer) or templates via REST API โ€” this corrupts block markup. Always use the Site Editor visual interface. โš  To fix a broken template part: Appearance โ†’ Editor โ†’ Template Parts โ†’ three-dot menu โ†’ “Clear customizations”. โš  Navigation auto-populates from WordPress menus. Never write raw HTML into wp:navigation blocks. โš  Page/post content CAN be created via REST API with valid block markup. โš  After changes, purge server cache (LiteSpeed Cache โ†’ Purge All, or equivalent). โ•โ•โ• BUILD MY SITE NOW โ•โ•โ• Based on my brief above: 1. Recommend a style variation that matches my brand feel and colors. 2. Create a page plan: list each page I need with its pattern composition (4-7 sections per page). 3. Generate homepage content first โ€” customize headings, text, and CTAs for my specific business. 4. Generate remaining pages with content tailored to my industry. 5. Set up navigation: which pages in what order. 6. If plugin is installed: configure analytics and review SEO output. Keep everything clean, native, portable, and editable in the WordPress Site Editor.

Stop building from scratch.

34 patterns, design tokens, AI prompt pack. One zip file. Five minutes to install.

Free forever. No credit card needed.