What's New in Drupal Canvas 1.0: Drupal's Official Visual Page Builder Has Arrived

What Drupal Canvas Actually Is

Canvas is a React-based visual page builder that lets editors compose pages by dragging and dropping components. But calling it "just another page builder" misses what makes it different from previous Drupal approaches.

The core idea is component-driven design. Instead of working with blocks, regions, and layouts (like Layout Builder), Canvas treats everything as composable components with defined properties. Editors assemble pages from a library of these components, configuring each one through a properties panel.

Key features in Canvas 1.0:

• Drag-and-drop interface with component library sidebar, search, and categories
• Multi-step undo so editors can experiment without fear
• Content Templates that let site builders create reusable page blueprints
• In-browser code component editing for developers who want to build and test components directly
• AI assistant that can generate components or assemble pages through a chat interface
• Multi-page creation and preview before publishing

Canvas pages are stored as Drupal entities, which means they work with Drupal's permission system, revision tracking, and content workflows. This is important because it means Canvas doesn't create a separate content silo. Everything stays within Drupal's content model.

The Technical Architecture

Canvas works with two types of components:

Code Components are React components that can be authored directly in the browser or in your codebase. They connect to Drupal data through props, giving developers precise control over what data editors can configure and how components render.

Single Directory Components (SDC) integration lets Canvas work with Drupal's emerging component ecosystem. Version 1.0 includes improved shape matching for component props and compatibility with SDC JSON Schema patterns.

For developers, Canvas provides CLI tooling with ESLint configuration and validation commands. This means you can build components locally, validate them against Canvas requirements, and deploy them knowing they'll work correctly in the builder interface.

How Canvas Compares to Existing Drupal Page Building Options

Drupal has had visual building tools for years. Understanding where Canvas fits requires looking at what already exists and what problems each tool solves.

Canvas vs. Layout Builder

Layout Builder is Drupal core's existing layout tool. It works well for arranging blocks within section-based layouts, and it's been the default answer for "how do I let editors customize page layouts" since Drupal 8.

The differences:

Layout Builder thinks in terms of sections, regions, and blocks. Editors arrange pre-made blocks within a grid structure. It's effective for relatively simple customization but can feel limiting for complex marketing pages.

Canvas thinks in terms of components and props. There's no fixed grid. Components can be nested, configured with detailed properties, and assembled into complex hierarchies. The React-based interface feels more like building in a design tool.

Layout Builder also lacks Canvas's AI features and in-browser component development tools. However, Layout Builder has years of production use, extensive documentation, and a large ecosystem of contributed modules.

Canvas vs. Paragraphs-Based Builders

Paragraphs has been the go-to approach for flexible content building in Drupal. Teams create paragraph types for different content blocks (hero sections, card grids, testimonials) and editors stack them to build pages.

Paragraphs is mature, extremely flexible, and works across all recent Drupal versions. But it's not visual: editors work with forms, not a drag-and-drop interface. For complex pages, the editing experience can become tedious.

Canvas provides the visual interface that Paragraphs lacks, but with a different architectural model. Rather than storing content in paragraph entities, Canvas stores component configurations as part of Canvas page entities.

Canvas vs. DXPR Builder

DXPR Builder is a commercial (with open-source components) visual builder that's been available for several years. It offers extensive AI features including the ability to generate pages from descriptions and clone competitor pages.

DXPR Builder works across Drupal 9, 10, and 11, has mature AI capabilities, and is battle-tested in production. It's a good choice if you need visual building today across multiple Drupal versions.

Canvas is free, community-driven, and positioned as the official Drupal visual builder going forward. It requires Drupal 11.2 , which limits where it can be deployed right now.

Canvas vs. GrapesJS/Viz Builder

Viz Builder wraps the GrapesJS open-source editor for Drupal. It's designed primarily for landing pages and marketing campaigns.

The main consideration: Viz Builder is not covered by Drupal's security advisory policy. For teams that need security coverage, this matters. Canvas carries the security policy shield, meaning security issues will be handled through Drupal's established processes.

Who Should Use Canvas And When

Canvas isn't the right choice for every project. Here's how to think about where it makes sense.

Good Fits for Canvas 1.0

New Drupal 11.2 projects where you're starting fresh and want to establish a component-based approach from day one. Canvas works best when you can design your component library around it rather than retrofitting existing content structures.

Marketing and campaign pages where editorial teams need to build visually rich pages quickly. The drag-and-drop interface and Content Templates feature are specifically designed for this use case.

Design-system-driven sites where you want to enforce brand consistency through controlled components. Canvas lets developers define exactly what editors can customize, keeping pages on-brand while still giving editors real flexibility.

Teams experimenting with AI-assisted content creation. The Canvas AI assistant is genuinely interesting. It can generate code components from descriptions and assemble pages using existing components. If you're exploring how AI fits into content workflows, Canvas provides a testbed.

Working with teams has taught us that visual building tools succeed or fail based on component library quality. A well-designed component library makes Canvas powerful; a poorly designed one creates frustration. Plan to invest in component design upfront.

Less Ideal Situations

Existing Drupal 9 or 10 sites can't use Canvas 1.0 at all. It requires Drupal 11.2 . If you're not ready to upgrade, other tools remain your options.

Sites with complex existing content in Layout Builder or Paragraphs don't have a clear migration path to Canvas. As of December 2025, there's no official migration tooling. Converting existing content would require custom development work.

Projects requiring immediate production stability. Canvas 1.0 is stable and security-covered, but its ecosystem is still emerging. Best practices, contributed component libraries, and community knowledge are still being developed. Early adopters will encounter gaps.

Making the Decision: A Practical Framework

If you're evaluating Canvas for an upcoming project, here's a practical framework.

Questions to Answer First

1. Are you on Drupal 11.2 or will you be soon? Canvas has no Drupal 10 support. This is a hard requirement.

2. Is this a new build or existing content? Greenfield projects can adopt Canvas cleanly. Existing sites with structured content in other systems face migration complexity.

3. What's your component development capacity? Canvas's power comes from custom components. If your team can build React components, you'll get more value. If you're relying entirely on pre-built options, your choices are currently limited.

4. How important is visual editing to your editorial team? Some teams genuinely need drag-and-drop interfaces; others are fine with form-based editing. Canvas is valuable when visual editing actually improves your team's workflow.

We recommend starting with a pilot if you're uncertain. Pick a section of your site, perhaps a campaign landing page or a new content type, and build it with Canvas. This gives you real experience without committing your entire content architecture to a new tool.

Timeline Considerations for Canvas Adoption

Canvas 1.0 released in early December 2025. The community is actively building around it, but ecosystem maturity takes time. Expect:

• Next 6 months: More documentation, contributed components, and integration patterns will emerge. Early case studies will surface.
• Next 12 months: Best practices will solidify. Migration guidance for common scenarios (Layout Builder, Paragraphs) will likely appear.
• Beyond: Canvas is positioned as Drupal's official visual builder. Investment and adoption should grow as Starshot matures.

If you don't need visual building immediately, waiting 6-12 months will give you a more mature ecosystem. If you're starting a greenfield Drupal 11 project now and want visual building, Canvas is worth serious evaluation.

Practical Recommendations for Canvas Implementation

Our experience shows that successful Canvas adoption depends on a few key factors.

For Development Teams

Invest in component architecture early. Define your component library structure, naming conventions, and prop patterns before building. Canvas components should be designed as a system, not created ad-hoc.

Use the CLI tooling. Canvas provides ESLint configuration and validation commands. Integrate these into your development workflow to catch issues before deployment.

Test the AI assistant carefully. The Canvas AI features require specific AI provider configurations (models with function calling support). Test with your chosen provider early and understand its limitations before exposing it to editors.

For Project Managers

Plan for component design time. Unlike template-based approaches where you're mostly configuring existing options, Canvas requires building custom components. Budget accordingly.

Set clear expectations with editors. Canvas provides flexibility within the boundaries developers create. Make sure editorial teams understand what's customizable and what isn't.

Start simple. Begin with a small set of well-designed components rather than trying to replicate all existing functionality immediately. Expand based on actual editorial needs.

For Editorial Teams

Take advantage of Content Templates. If you're building similar pages repeatedly, ask your development team to create templates. This speeds up page creation significantly.

Use multi-step undo liberally. Canvas is designed for experimentation. You can try changes, undo them, and try again without risk.

Provide feedback on component needs. The component library will evolve based on real usage. When you find yourself wishing for a component that doesn't exist, communicate that to your development team.

What Canvas Means for Drupal's Future

Canvas arriving as a stable release is significant for the Drupal ecosystem. It signals that Drupal is serious about competing with WordPress page builders like Elementor, not by copying their approach, but by providing visual building that works within Drupal's structured content model.

The Starshot initiative identified visual building as critical to Drupal's competitiveness for marketing teams and smaller projects. Canvas delivers on that goal, though the full impact depends on ecosystem growth and adoption over the coming year.

For agencies and teams already invested in Drupal, Canvas provides a new option in the toolkit. It doesn't replace Layout Builder or Paragraphs overnight, but it offers capabilities neither provides: true visual composition, AI assistance, and a component architecture designed for design systems.

Next Steps

Canvas 1.0 is available now for Drupal 11.2 sites. If you're ready to explore it:

• Install via Composer: 

• composer require 'drupal/canvas:^1.0'

• Review the documentation at project.pages.drupalcode.org/canvas
• Explore the AI assistant configuration if you're interested in AI-assisted building

Canvas adoption requires thoughtful component planning and a clear understanding of how it fits your editorial workflow. If you're considering Canvas for an upcoming Drupal 11 project and want help evaluating whether it's the right approach for your team's needs, we can walk you through the architectural decisions and help you assess the component design work involved.