Your Rails app
deserves a canvas.
ActiveCanvas is an open-source CMS engine for Rails 8+. Drop in a visual page builder, AI content generation, and production-ready Tailwind CSS compilation — without leaving your monolith.
Features
Everything you need.
Nothing you don't.
A complete CMS that mounts into your existing Rails app. No external services, no iframes — just one gem.
Visual Page Builder
Drag-and-drop editor powered by GrapeJS. Pre-built blocks, live code editing, asset management, and instant preview across desktop, tablet, and mobile.
AI Content Generation
Generate text, images, and convert screenshots to production code. Streaming responses with framework-aware prompts. OpenAI, Anthropic, or OpenRouter.
Tailwind CSS Compilation
CDN in the editor for instant preview. Compiled per-page CSS in production — zero bloat, no CDN dependency. Also supports Bootstrap 5 or vanilla CSS.
Page Versioning
Every change tracked automatically. Visual diffs show exactly what changed, who made the edit, and when. Roll back to any version with one click.
Media Library
Upload and manage assets with Active Storage. Works with local disk, S3, GCS, or Azure. Drag images directly into the editor from the built-in library.
Flexible Authentication
Works with Devise out of the box. Or bring your own: custom controllers, HTTP Basic, or lambda-based auth. Isolated namespace means zero conflicts.
Visual Editor
Build pages visually.
Ship with confidence.
The ActiveCanvas editor gives your team a production-grade page builder that lives inside your Rails app. No external services. No vendor lock-in.
Drag-and-drop blocks
Sections, columns, text, images, videos, forms, and more
Inline code editor
Monaco-powered HTML, CSS, and JavaScript editing with syntax highlighting
Responsive preview
Instantly switch between desktop, tablet, and mobile viewports
SEO controls
Meta tags, Open Graph, Twitter Cards, and JSON-LD structured data
AI-Powered
AI that understands
your stack.
ActiveCanvas AI knows your CSS framework and generates code accordingly. Tailwind v4 utilities, Bootstrap 5 components, or vanilla CSS — it adapts.
Generate
Describe a section and watch it appear. Streaming text generation builds your page in real-time with framework-specific HTML.
"Create a pricing table with 3 tiers"
// Output: streaming...
<section class="py-24">
<div class="grid grid-cols-3 gap-8">
Image
Create images from text descriptions using DALL-E. Generated images are stored in your media library and served through Active Storage.
Screenshot → Code
Upload a screenshot and get production-ready HTML. The AI matches layout, colors, typography, and outputs code using your configured CSS framework.
Installation
Up and running
in 60 seconds.
Add the gem
gem "active_canvas"
Install and migrate
$ bin/rails generate active_canvas:install
$ bin/rails db:migrate
Start building
http://localhost:3000/canvas/admin
# Published pages served at
http://localhost:3000/canvas/your-page-slug
# Authentication
config.authenticate_admin = :authenticate_user!
# CSS Framework — :tailwind, :bootstrap5, or :none
config.css_framework = :tailwind
# AI Features
config.enable_ai_features = true
config.ai_rate_limit_per_minute = 30
# Uploads
config.max_upload_size = 10.megabytes
end
Open Source
Free and open source.
Forever.
MIT licensed. Built by developers, for developers. Contribute, fork, extend — no strings attached.