Overview
A JSON document format for native rendering across platforms - a modern alternative to PDF.
Joy DOM is a JSON document format. One document, rendered natively on the web (React), Apple platforms (Swift), and Android (Kotlin) - using a focused subset of HTML and CSS. Built for people tired of PDF and looking for a universal document format that is semantic, responsive, accessible, and machine-readable.
Learn
Quickstart
Render your first Joy DOM document in five minutes.
Tutorial
A guided walk through document model, styling, breakpoints, and custom components.
Platforms
React
Install, embed, and the full @joy-dom/react API.
Swift
Native SwiftUI / UIKit rendering via a Yoga-based layout engine.
Kotlin
Jetpack Compose and Compose Multiplatform.
Use cases
Migration
Migrating from PDF
Translating absolute-positioned PDF layouts into Joy DOM.
Migrating from HTML
Which HTML maps directly and what needs a custom node.
Reference
Specification
The numbered, deep-linkable format spec - nodes, properties, breakpoints, custom components.
@joy-dom/spec
TypeScript types and JSON Schema for the document format.
Joy DOM vs PDF
| Capability | Joy DOM | |
|---|---|---|
| Semantic structure | ✅ JSON tree of typed nodes | ⚠️ Tagged PDF (often missing) |
| Responsive layout | ✅ Breakpoints | ❌ Fixed page size |
| Accessibility | ✅ Inherits HTML semantics | ⚠️ Depends on tagging |
| Native rendering | ✅ React / Swift / Kotlin | ❌ Embedded viewer required |
| Machine readable | ✅ JSON + JSON Schema | ⚠️ Binary, parser-dependent |
| Editable downstream | ✅ Plain JSON | ❌ Requires PDF tooling |
| LLM-friendly | ✅ Tree of strings | ❌ Lossy text extraction |
| File size | ✅ Tiny JSON | ⚠️ Often large |
Showcase
Examples of real Joy DOM documents will appear here. The current set is being curated - check back soon.