Get started

Compose author-grade interactive content with AI.

90+ accessible Web Components and curated SKILLs that teach Claude, ChatGPT, and Gemini how to produce finished lessons, stories, and editorial pieces. Inside the tools you already use. Yours to keep forever.

Start free See use cases
No credit card required.

What's in the box

Three pieces, one workflow.

Modula bundles a component library, a set of AI instruction packs, and the connectors that make them talk to your AI of choice. Each piece earns its place.

Components

90+ accessible Web Components for editorial and pedagogical content — timelines, scrollytelling, quizzes, drag-and-drop, map-driven narratives. Vanilla, framework-agnostic, themeable.

Explore components

SKILLs

Curated instruction packs that teach AI how to assemble components into finished pieces. The SKILL knows the structure of a lesson, a story, a training module. You provide the topic.

See the SKILLs

MCP integration

One MCP server. Every AI. Claude, ChatGPT, and Gemini discover components on demand, read their docs, and stay within your license — no client-side trust.

How MCP works

How it works

From prompt to publishable piece.

Three steps. No new tools to learn — Modula extends the AI you already use.

  1. 01 • Connect

    Add Modula as an MCP server to Claude, ChatGPT, or Gemini. Takes thirty seconds and one command.

  2. 02 • Compose

    Pick a SKILL ("Lesson", "Map Scroller", "Training Module") and describe what you want. The AI assembles components into a draft.

  3. 03 • Ship

    Review, tweak, publish. The output is a self-contained Web Component — embed it anywhere, export to SCORM, hand it to your CMS.

Connect with the AI you already use.

Claude.ai

Connect via MCP to give Claude full knowledge of Modula's component APIs, schemas, and documentation.

Connect

Claude Design

Bring Modula's component knowledge into Claude Design to create and assemble interactive prototypes with AI assistance.

Connect

ChatGPT.com

Install the Modula plugin in ChatGPT to compose interactive artifacts directly from the chat interface.

Connect

Codex

Connect Modula's MCP server to OpenAI Codex CLI for AI-powered component generation directly in your terminal.

Connect

Claude Code

Use Claude Code's native MCP support to access Modula's full component library and documentation in your terminal.

Connect

Cursor

Add Modula as an MCP server in Cursor to get component completions, docs, and scaffolding inside your IDE.

Connect

Gemini

Coming soon

Use the Modula extension for Gemini to turn prompts into fully assembled, ready-to-embed components.

Who it's for

Different roles, same workflow.

Trainers, editors, creators, developers — all producing the same kind of artifact, each with their own entry point.

Trainer

Compliance training for 200 employees in four weeks.

Twelve SCORM-ready units in two weeks, generated from Claude with the Lesson SKILL.

See how

Editor

Interactive textbook appendices that update every term.

Simulations, charts, and quizzes embedded in the publisher's CMS, regenerable without dev help.

See how

Creator

A scrollable travel narrative with photos and GPS track.

A published piece in four hours from a single ChatGPT session — embedded on the writer's own site.

See how

Developer

A scroll-driven longform for a news investigation.

Components pulled into an existing SvelteKit project via MCP, themed in one sprint instead of three.

See how
See all use cases

For developers

Integrate components directly into any stack.

When the output needs to live inside a complex system — a CMS, a design system, a custom stack — your dev team can pull components directly via MCP and CLI. Standard Web Components, no wrappers, no adapters.

  • — MCP server gives AI coding agents full access to component docs and APIs
  • — Works in any codebase — React, Vue, Svelte, or plain HTML
  • — Custom SKILLs and theming to match your design system
# ask Claude Code or Codex
> add Modula's map component to this page

  Searching components...  dna-map found
  Reading documentation... done
  Loading the script...    done

<dna-map center="45.46,9.19"></dna-map>

# or go straight from the terminal
npx modula add dna-map

Showcase

What you can ship.

Mockups while we onboard launch partners. Real examples land here as soon as creators publish them.

Training Pro

Data Privacy Compliance Course

Twelve units with explainer video, scenario exercise, and quiz — exported to SCORM.

SKILL Lesson
Uses dna-videodna-quizdna-progress
Story Pro

Adriatic Sailing Journey

Scroll-driven travel narrative with GPS track, photo stops, and journal entries.

SKILL Map Scroller
Uses dna-mapdna-scroll-stepdna-gallery
Data Pro

Ocean Temperature Anomalies

A scrollable data story showing surface temperature trends from 1950 to 2023.

SKILL Data Story
Uses dna-chartdna-scroll-stepdna-annotation
See the gallery

Pricing

Flat pricing, yours forever.

Pay while you create. What you produce during an active subscription stays yours — portable Web Components, no platform lock-in. Paid plans launch with the public beta.

Playground

Free

For learning, teaching, and exploring.

  • Educational component subset
  • Lesson SKILL
  • All AI connectors
  • Non-commercial use
Start free

Pro

Coming soon
€X / year

Pricing finalised before public launch.

  • All 90+ components
  • All public SKILLs
  • Commercial use
  • Removable signature
  • Email support
Join the waitlist

Enterprise

Custom

For teams that need a tailored solution.

  • Everything in Pro
  • Custom SKILLs & components
  • Dedicated integrations
  • Consulting & onboarding
  • SLA support
Contact sales

Questions we hear

A few answers.

What exactly is a SKILL?
A SKILL is a curated instruction package that teaches an AI model how to compose a complete piece of interactive content — a lesson, a story, a scrollytelling article. It pairs Modula's components with the editorial and pedagogical decisions needed to assemble them well. You give the AI a topic; the SKILL provides the structure.
Do I need to know how to code?
No. Most of Modula is designed to be used through your AI of choice — Claude, ChatGPT, or Gemini. You describe what you want; the AI uses Modula via MCP to produce the result. Developers who do want to integrate the components directly into an existing codebase can do that too.
What happens to my content if I cancel my subscription?
Everything you produced during an active subscription keeps working forever. The output is a self-contained Web Component artifact — no calls home, no platform dependency. You lose the ability to create new content and the access to updated components and SKILLs, but what you already shipped is yours indefinitely.
Can I use Modula for commercial work?
Commercial use is included on Pro and Enterprise. Playground is free for learning, teaching, and exploration but not for commercial output.
How does Modula compare to v0, Lovable, or Bolt?
Those tools ask the AI to invent components from scratch — great for prototypes, weak for content you'll publish. Modula gives the AI a fixed library of accessible, themeable components and step-by-step guidance, so the output is visually coherent across generations, accessibility-tested, and ready to ship.
Can my dev team integrate Modula into our existing stack?
Yes. The components are vanilla Web Components — they work in React, Vue, Svelte, Astro, or plain HTML. Your team can pull bundles via MCP, npm, or the CLI and theme them to match your design system.

Get started

Free to try, no credit card.

The Playground includes everything you need to compose a lesson, a quiz, or a short interactive piece. See it on your own work in under an hour.

Create a free account Read the docs

Get in touch

Contact us.

Plan of interest
Modula is an experimental SaaS platform for distributing Web Components.
If what you found on this site sounds interesting, please reach out to us at info@chialab.it while we are setting up the platform.