Interactive books, cards, and websites from Markdown.
Write once. Publish interactive books in 80 languages. A Markdown-first open-source platform for books, cards, presentations, and AI-ready content experiences.
HyperCardBook is an open-source, Markdown-first platform for creating interactive books, web pages, presentations, learning materials, and knowledge bases — all from a single Markdown file.
The philosophy is simple: Markdown is the document. HTML, CSS, and JavaScript are extensions.
You write in Markdown. You enhance with HTML when layout demands it. You style with CSS. You add interactivity with vanilla JavaScript. The result is a fully interactive static experience — no server, no build step, no framework required.
Layer
Role
When to use
Markdown
Main content and structure
Everything you write
HTML
Advanced layout
Grids, iframes, buttons
CSS
Visual design
Colors, typography, effects
JavaScript
Local front-end interaction
Tabs, accordions, counters
What can you create?
Interactive books that visitors read page by page
HyperCard web pages — full websites in a single Markdown file
Stacks — curated bookshelves of books and cards
Presentations and slide decks
Learning materials with embedded video and quizzes
Product guides and documentation
Portfolios and personal sites
Knowledge bases for teams and communities
"This page itself is a HyperCard-style website — built in one Markdown file with embedded HTML, CSS, and JavaScript."
★ Live Showcase
See It in Action
"The best way to understand HyperCardBook is not to read about it. It is to touch it." — Try the live examples below, each running inside this very page.
HyperBook Sample
Getting Started with HyperCardBook
This HyperBook introduces HyperCardBook itself. Experience the page-turning book interface, large readable cards, images, videos, and onboarding content — all built from Markdown.
HyperBook Sample
PapeRobo Introduction
This HyperBook introduces PapeRobo — the phone-style AI character platform. It shows how a HyperBook can explain another product through interactive, scrollable pages built from Markdown.
HyperCard Sample
Markdown + HTML + CSS + JavaScript
This HyperCard demonstrates how a single Markdown document becomes a rich, interactive web page. HyperCard is the website-building side of HyperCardBook — the same format powering this very page.
PapeRobo Sample
Phone-Style AI Character
PapeRobo is a phone-style AI character experience within the MarkdownAI ecosystem. Not the main subject of this project, but a glimpse at where the HyperRobo integration is headed.
📝 Philosophy
Why Markdown First?
Markdown is more than a text format. It is the most durable, portable, AI-native content language ever created. Here is why we chose it as the foundation.
👁
Human-readable
A Markdown file reads naturally even without rendering. Any person, any tool, any era can open and understand it.
✏️
Instantly editable
No proprietary editor. No special software. Any text editor works. Authors stay focused on content, not tooling.
🤖
AI-native
LLMs write, edit, and reason about Markdown fluently. HyperCardBook is already aligned with the way AI creates content.
🔀
Git-friendly
Plain text diffs cleanly. Version control, branching, pull requests — all the developer workflows apply to your content.
⏳
Durable
Markdown files written in 2010 are still readable today. Your content will outlive any CMS, platform, or proprietary format.
🌐
Universal
Markdown is the lingua franca of technical writing, documentation, READMEs, blogs, notes, and now interactive books.
🔌
Extensible
Embed HTML exactly where needed. Add a style block. Drop in a script. Markdown stays readable; HTML adds power precisely where required.
📦
Self-contained
One file. No build system. No dependencies. No node_modules. The whole document ships as a single, portable, shareable unit.
How HyperCardBook Compares
Traditional Site Builders
Drag-and-drop GUIs
Vendor lock-in
Hard to version-control
Not AI-friendly
No Markdown
Documentation Generators
Markdown-based but book-only
No interactivity
Requires build pipeline
Multi-file only
No website output
Slide Tools
Presentation-only format
No book mode
Limited HTML extension
Vendor-specific formats
Poor for long content
⬛ HyperCardBook ✓
Markdown-first, always
Books and websites
One file, no build step
Full HTML/CSS/JS support
80-language publishing
📖 HyperBook
HyperBook — Interactive Reading Experiences
A HyperBook is an interactive, page-turning book experience built entirely from Markdown. It handles the layout, navigation, and reading UX — you just write.
What HyperBook delivers
Page-turning navigation — tap, swipe, or click
Mobile-first reading with large, comfortable typography
Full Markdown content on every page
Image and video embedding on any page
YouTube Shorts and YouTube video support
Google Maps embedding
Google Sheets embedding
Public bookshelf listing
80-language auto-translation publishing
Swipe navigation on touch devices
Responsive layout for all screen sizes
Who uses HyperBook?
Educators building digital textbooks and lesson sets
Authors publishing picture books, photo books, and stories
Companies creating product guides and onboarding materials
Creators building workshop materials and community showcases
AI tools generating educational books automatically
Language learners and children's learning apps
🃏 HyperCard
HyperCard — Websites in One Markdown File
A HyperCard is a single Markdown document that becomes a full, rich, interactive web page. It is the website-building side of HyperCardBook — and this page is one.
A HyperCard source looks like this:
# My HyperCard
Markdown content here — paragraphs, lists, tables, images, code blocks.
<div class="special-section"> HTML only when Markdown is insufficient. </div>
This page itself is a HyperCard — one .md file containing all the Markdown, HTML, CSS, and JavaScript you see here.
📚 Stack
Stack — Your Curated Bookshelf
A Stack is a bookshelf-style collection of HyperBooks and HyperCards. Organize your content, curate a portfolio, or build a public knowledge base.
🏢
Product Documentation
Keep every guide, manual, and API reference in one Stack — organized, searchable, and always up to date.
🎓
Course Materials
Arrange lessons, exercises, and supplementary reading into a structured learning Stack that students can explore at their own pace.
🧠
Corporate Knowledge Base
Centralize company documentation, policies, playbooks, and internal guides into a single, version-controlled Stack.
🎨
Creator Portfolio
Showcase your work — books, articles, case studies, and interactive demos — in a polished public-facing Stack.
🌐
Public Sample Collection
Share open-source HyperBooks and HyperCards with the community through a publicly browsable Stack.
🛠
Workshop Materials
Distribute workshop slides, exercise files, and reference cards as a Stack that participants can revisit any time.
The HyperCardBook Content Hierarchy
Level
What it is
Contains
Stack
Bookshelf / collection
Multiple Books and Cards
HyperBook
Interactive book
Multiple cards / pages
HyperCard
Single-page web experience
Markdown + HTML/CSS/JS
🗺 Architecture
The MarkdownAI Ecosystem
HyperCardBook is the open-source core of a broader ecosystem. Here is how the pieces relate.
MarkdownAI Ecosystem "Markdown is all you need"
↓
⬛ HyperCardBook Open Source · MIT License
↓
📖 HyperBook Interactive Books
🃏 HyperCard Web Pages
📚 Stack Bookshelves
↓
🤖 HyperRobo Combined Experience
📞 PapeRobo AI Character (proprietary)
✓ HyperCardBook
Open source, MIT licensed. The platform anyone can build on, fork, and extend.
⊘ PapeRobo
Proprietary product. Phone-style AI character platform in the MarkdownAI ecosystem.
⟳ HyperRobo
Combined experience: HyperCardBook content + PapeRobo AI characters in one integrated surface.
◎ MarkdownAI
The broader ecosystem. Started as an AI Markdown editor in 2024; HyperCardBook is now its open-source core.
✨ Features
Everything You Need
24 capabilities that make HyperCardBook the most versatile Markdown-first publishing platform available.
📝
Markdown-First Authoring
Write everything in standard Markdown. Headings, lists, tables, links, images — all native and readable without rendering.
📖
Interactive HyperBooks
Page-turning book interface with swipe navigation. Read like a real book — on desktop, tablet, or phone.
🃏
HyperCard Web Pages
Build full websites in a single Markdown file. HTML, CSS, and JavaScript extend Markdown exactly where needed.
📚
Stack Bookshelf
Organize Books and Cards into curated, browsable collections. Build course materials, documentation sites, and portfolios.
🌐
80-Language Publishing
Publish your content in 80 languages automatically. Write once, reach global audiences with a single click.
📱
Mobile-First Reading
Every HyperBook and HyperCard is designed for mobile from the ground up. Reads beautifully on any screen.
👆
Swipe Navigation
Touch-native HyperBook navigation. Readers swipe left and right to turn pages, just like a real book.
🖼
Image Embedding
Embed images with standard Markdown syntax. No special tags, no uploads dashboard — just ``.
🎬
Video Embedding
Embed any video — YouTube, Vimeo, or direct — into any Book page or Card section with a simple iframe.
📲
YouTube Shorts Support
Embed YouTube Shorts in vertical format. Perfect for modern, mobile-first content experiences.
🗺
Google Maps Support
Embed any Google Maps view — street maps, street view, directions, or custom maps — directly in your content.
📊
Google Sheets Support
Embed live Google Sheets for dynamic data tables, charts, and spreadsheets right inside your Book or Card.
📤
HTML Export
Your content is already HTML-ready. Export, embed, or share as a standalone static page with no extra tooling.
🎨
CSS Customization
Full CSS control inside HyperCards. CSS variables, media queries, gradients, animations — all supported.
⚙️
Front-End JavaScript
Add interactivity with vanilla JavaScript. Tabs, accordions, counters, form previews — no framework required.
📬
Public Bookshelf
List your HyperBooks on the public HyperCardBook bookshelf. Reach readers who discover new content to explore.
🔀
GitHub-Friendly Source
Plain Markdown files diff cleanly in Git. Version control, review, and collaborate on your content like code.
🤖
AI-Assisted Creation
LLMs write Markdown natively. Generate, edit, and expand your HyperBooks and HyperCards with any AI assistant.
📞
PapeRobo Ecosystem
Connect your content to PapeRobo AI characters. Let readers interact with your HyperBook through a phone-style AI.
🔮
HyperRobo Experience
The combined future: HyperCardBook content + AI characters in one seamlessly integrated reading and conversation experience.
📕
ePub Potential
Markdown-first source makes ePub export a natural next step. Your content is already structured for multi-format publishing.
🎓
Education Use Cases
Built for teachers, trainers, and learning designers. Create textbooks, lesson sets, and interactive learning materials.
🖥
Presentation Use Cases
Turn your Markdown into a slide-style presentation. Each page becomes a screen, each Card becomes a deck.
🚀
Creator Publishing
Publish your work to a global audience with zero infrastructure. One Markdown file, infinite readers.
🛝 Interactive Playground
Front-End Interactivity — Live Demo
Everything below runs in your browser — no server, no backend, no external library. Just Markdown + vanilla JavaScript, the HyperCard way.
📝 Markdown — The Foundation
Markdown handles everything you read as text. Paragraphs, headings, lists, tables, code blocks, links, and images all live in Markdown. It is the source of truth for your content.
Standard CommonMark syntax
Human-readable without rendering
AI tools write it natively
Git diffs cleanly
Supports GFM tables and task lists
🔧 HTML — Layout Enhancement
HTML is used only where Markdown cannot reach: responsive grids, iframe containers, buttons, custom components, and architecture diagrams. The rule: if Markdown can do it, use Markdown.
Inline HTML is valid Markdown
Used for grids, iframes, buttons
Never wraps the whole document
Minimal: only where layout demands it
No <html><head><body> tags
🎨 CSS — Visual Design
All CSS lives in one <style> block. Modern CSS — variables, gradients, grid, flexbox, glassmorphism, transitions — makes the experience polished without any external library.
CSS custom properties (variables)
Media queries for responsiveness
No Bootstrap, no Tailwind CDN
Glassmorphism and gradients
Dark/light mode via class switching
⚡ JavaScript — Local Interaction
All JavaScript lives in one <script> block. Vanilla JS only. No React, no Vue, no external bundles. Tabs, accordions, counters, form previews — everything runs locally in the browser.
Vanilla JavaScript only
No API calls, no backend
No external libraries or CDN
Browser-local state only
Works offline after first load
🔢 Live Counters
0
Languages
0
Markdown File
✓
Backend Needed
MIT
License
📋 Demo Form Preview
❓ FAQ Preview
HyperCardBook is an open-source, Markdown-first platform for creating interactive books, web pages, presentations, and knowledge bases — all from a single .md file.
No. This is the HyperCardBook open-source project website. MarkdownAI is the broader ecosystem; HyperCardBook is its open-source core. They are related but distinct.
For HyperBooks, no. Standard Markdown is enough. For HyperCards with custom styling and interaction, basic HTML/CSS/JS knowledge is helpful but not required to get started.
Yes — vanilla JavaScript only. You can add tabs, accordions, counters, animations, form validation, and any browser-local interaction. External libraries and API calls are not supported.
Yes. HyperCardBook supports publishing in 80 languages. Write your content once in your primary language and publish globally with automatic translation support.
🖼 Gallery
A World of Content
HyperCardBook is for books, knowledge, education, technology, and creative publishing — across every topic, language, and audience.
Books & Reading
Library
Coding
Education
Mobile Reading
AI & Technology
Creative Writing
Smartphone
Knowledge
Creative Workspace
Learning
Dashboards
Presentations
Open Source
80 Languages
Publishing
📅 Timeline
The Journey
From AI Markdown editor to the most versatile open-source content platform.
2024
MarkdownAI Beta Launched
MarkdownAI launched as an AI-powered editor specializing in Markdown — making it easy for anyone to write, edit, and publish structured content with AI assistance.
July 2026
HyperCardBook Becomes the Core
HyperCardBook is born as the new interactive publishing core of MarkdownAI. HyperBook, HyperCard, and Stack define the content model. The vision: write once, publish everywhere.
2026
Open-Source Release
HyperCardBook opens as a community project under the MIT License. GitHub repository launches. Community contributions, sample Books, sample Cards, and localizations are welcomed.
Future
HyperRobo, PapeRobo, Premium Services
HyperRobo integrates HyperCardBook content with PapeRobo AI characters. Premium MarkdownAI services expand on the open-source foundation. ePub export, advanced Stack features, and more.
🔓 Open Source
Built for the Community
HyperCardBook is MIT licensed and open to everyone. Use it, fork it, build on it, and help shape its future.
How to Contribute
★ Star the GitHub repository to show support
📖 Contribute sample HyperBooks for the community bookshelf
🃏 Share sample HyperCards showing creative use cases
📝 Improve documentation and write guides
🌐 Help localize content into other languages
🐛 Report bugs and test edge cases
💡 Suggest features and use cases in GitHub Discussions
🤝 Partner with us — educational, publishing, or AI projects welcome
Use HyperCardBook freely in personal and commercial projects. No royalties, no restrictions. Build products on top of it. Fork it. Sell it. The only requirement: keep the license notice.
📦 GitHub Repository
All source code, sample content, and documentation lives on GitHub. Issues, discussions, and pull requests are open to the community.
Whether you are building with HyperCardBook, contributing to the open-source project, exploring a partnership, or simply curious — we would love to hear from you.
HyperCardBook is an open-source, Markdown-first platform for creating interactive books (HyperBook), rich web pages (HyperCard), and curated content collections (Stack). One Markdown file becomes an interactive experience — with optional HTML, CSS, and vanilla JavaScript for advanced layout and interactivity.
Yes. HyperCardBook is open source under the MIT License. You can use it freely in personal and commercial projects, fork it, modify it, and build products on top of it. The GitHub repository is open for contributions, issues, and discussions.
No. This is the HyperCardBook open-source project website. MarkdownAI is the broader ecosystem that HyperCardBook is part of, but this site is specifically about the open-source HyperCardBook project — its tools, community, and mission.
A HyperBook is an interactive, page-turning book experience built from Markdown. It handles the layout, swipe navigation, and reading UX automatically. You write Markdown pages; HyperBook presents them as a beautiful, mobile-first book. It supports images, video, YouTube Shorts, Google Maps, and Google Sheets embedding.
A HyperCard is a single Markdown document that becomes a full, rich, interactive web page. It supports Markdown for content, HTML for advanced layout, CSS for design, and vanilla JavaScript for front-end interaction — all in one file. This website is itself a HyperCard.
A Stack is a bookshelf-style collection of HyperBooks and HyperCards. It lets you organize content into structured sets — courses, documentation sites, portfolios, product guides, or public sample galleries. Stacks are browsable and can be made public.
Yes — that is exactly what HyperCard is designed for. A single Markdown file with embedded HTML, CSS, and JavaScript becomes a full website. This page is the best proof: a complete, polished, multi-section website in one .md file.
For HyperBooks: no programming required. Write standard Markdown and HyperCardBook handles the rest. For HyperCards with custom design and interactivity: basic HTML, CSS, and JavaScript knowledge is helpful. Most creative effects can be achieved by copying and adapting patterns from examples.
Yes. Vanilla JavaScript is fully supported in HyperCards. You can add tabs, accordions, counters, form previews, animations, theme toggles, and any browser-local interaction. External libraries, API calls, and server-side code are not supported — everything must run locally in the browser.
Yes. HyperCardBook supports publishing in 80 languages. Write your content in your primary language and HyperCardBook can publish it to global audiences with translation support. This makes it ideal for educational content, product documentation, and creator publishing that needs to reach a diverse audience.
No. PapeRobo is a proprietary product in the MarkdownAI ecosystem. It is a phone-style AI character platform. HyperCardBook is the open-source core; PapeRobo and HyperRobo are proprietary products that build on top of it.
HyperRobo is a combined experience integrating HyperCardBook content with PapeRobo AI characters. It represents the future direction of the MarkdownAI ecosystem — where readers can interact with your HyperBook content through a phone-style AI character. HyperRobo is in development.
Star the GitHub repository, submit sample HyperBooks or HyperCards, improve documentation, help with localization, report bugs, or reach out about partnership. All contribution types are welcome — code, content, testing, and translation. Use the GitHub repository or the contact form on this page.
The HyperCardBook GitHub repository is at github.com/kouichinagata/hypercardbook. Issues, discussions, and pull requests are open. Star it to stay updated.
