Skip to content

About

An open source Notion alternative that runs entirely in your browser. Pages, blocks and databases with no account and no server.

Topics

Resources

Stars

1 star

Watchers

0 watching

Forks

Latest commit

Β 

History

63 Commits

Folders and files

Repository files navigation

OpenNotion: write, plan and organize. Open source, in your browser.

An open source Notion alternative that runs entirely in your browser.
Pages, blocks and databases. No account, no server, no tracking.

Try the live demo β†’

MIT License React 19 TypeScript Vite Local first PRs welcome Live demo

Unofficial project. Not affiliated with Notion Labs, Inc. See the disclaimer.

Quick start Β· Features Β· Shortcuts Β· How it works Β· Roadmap Β· Contributing


Creating a page with the slash menu, formatting text, dragging a board card and switching to dark mode


Why OpenNotion

πŸ”’ Yours

Everything lives in your browser's storage. There is no account to create, no server to trust and nothing you write leaves your machine. The app loads its own scripts, fonts and images from its own host; an image you add by link loads from the site that hosts it. Export a full JSON backup whenever you want.

⚑ Instant

No loading spinners and no network round trips. Pages open immediately, typing never lags and an open tab keeps working if your connection drops (a reload needs the network, because there is no service worker yet).

🧱 Familiar

Blocks, the slash menu, Markdown shortcuts, drag handles, databases with six views and a side peek. If you know Notion, you already know OpenNotion.

Quick start

git clone https://github.com/Co-Messi/Open-Notion.git
cd Open-Notion
npm install
npm run dev

Open http://localhost:5174/app/ for the workspace (the landing page is at http://localhost:5174). A starter workspace with example pages and databases is created on first launch.

Or skip the install and use the hosted demo at open-notion-app.vercel.app. Your data still stays in your own browser.

To host it yourself, run npm run build and serve the dist/ folder from any static host (GitHub Pages, Vercel, Netlify, Cloudflare Pages or a plain web server). Each visitor gets their own private workspace in their own browser. The security headers (a strict Content-Security-Policy, Referrer-Policy: no-referrer and nosniff) live in vercel.json; on another host, send the same headers (the built pages also carry the policy as a meta tag for hosts that cannot send headers). npm run preview serves them locally. Give OpenNotion its own origin: on a GitHub Pages user site (username.github.io) every project shares one origin, so any other page hosted there could read the notes stored by this one.

Features

✍️ Write with blocks

Slash command menu Selection toolbar
Slash menu. Type / to insert any block: headings, lists, to-dos, toggles, callouts, quotes, code, images, bookmarks, tables, columns, subpages and databases. Selection toolbar. Bold, italic, underline, strikethrough, inline code, links, ten text colors and ten background colors, or turn the block into another type.
  • Markdown shortcuts as you type: # ## ### for headings, - for bullets, 1. for numbers, [] for to-dos, > for toggles, " for quotes, ``` for code, --- for a divider, plus **bold**, *italic*, `code` and ~strike~ inline.
  • Drag and drop any block by its handle. Drop it beside another block to create columns.
  • Block selection with Esc or a drag rectangle, then delete, duplicate, indent, move or recolor many blocks at once.
  • Undo and redo across every edit, including structural ones like splitting and merging blocks.
  • Code blocks with syntax highlighting for 20+ languages, simple tables, images by upload or link, and web bookmarks.
  • IME friendly input, tested with Chinese pinyin.

πŸ—‚οΈ Organize with databases

Board view grouped by status
Table view

Table

Timeline view

Timeline

Calendar view

Calendar

Gallery view

Gallery

Side peek with editable properties

Open any row in a side peek to edit its properties and content without leaving the view.

  • Six views: table, board, list, gallery, calendar and timeline, each with its own filters, sorts, grouping and visible properties.
  • 13 property types: text, number, select, multi select, status, date (with time and ranges), person, checkbox, URL, email, phone, created time and last edited time.
  • Inline or full page: drop a database into any page with /table view, or open it on its own.
  • Side peek opens a row next to the view so you can edit its properties and content without losing your place.
  • Drag cards between board columns, bars across the timeline and events across the calendar.

🧭 Find and navigate

Search Home
Search everything with ⌘K. Matches titles and page content, with a live preview of the selected page. Home shows recently visited pages, quick guides and upcoming events pulled from your dated database rows.
  • Tabs across the top, each with its own back and forward history.
  • Sidebar with Favorites, upcoming events, teamspaces and a nested page tree you can reorder and nest by dragging.
  • Templates for meeting notes, to-do lists, journals, specs, task trackers, reading lists, content calendars and wikis.
  • Trash with restore, and a Library of every page.

🎨 Make it yours

Light and dark themes Page with cover and icon
Light, dark or system theme. Toggle any time with ⌘ ⇧ L. Icons and covers from 1,000+ emoji, gradients, bundled illustrations, uploads or any image link. Reposition covers by dragging.
  • Serif and mono page fonts, small text, full width and page lock.
  • Comments on pages, favorites, duplicate, move and nested subpages.
  • Import Markdown files, export any page as Markdown, and back up or restore the whole workspace as JSON.

How OpenNotion compares

OpenNotion Notion
Open source βœ… MIT ❌
Price Free Free plan, paid tiers
Account required No Yes
Where your data lives Your browser Notion's cloud
Works offline In an open tab, no offline reload yet Partially
Self hosting Any static host ❌
Real time collaboration Not yet βœ…
AI features ❌ βœ…
Integrations and API Not yet βœ…

OpenNotion is for people who want the Notion way of working in a tool they fully own. If you need a team wiki with live collaboration today, Notion is the better choice.

Keyboard shortcuts

General
Action Shortcut
Search ⌘ K or ⌘ P
New page ⌘ N
Toggle sidebar ⌘ \
Toggle dark mode ⌘ ⇧ L
Back / forward ⌘ [ / ⌘ ]
Settings ⌘ ,
Undo / redo ⌘ Z / ⌘ ⇧ Z
Editing
Action Shortcut
Bold / italic / underline ⌘ B / ⌘ I / ⌘ U
Strikethrough ⌘ ⇧ S
Inline code ⌘ E
Add link ⌘ K with text selected
Soft line break ⇧ Enter
Indent / outdent Tab / ⇧ Tab
Toggle to-do or open toggle ⌘ Enter
Turn into text, heading 1 to 3 ⌘ βŒ₯ 0 to 3
Turn into to-do, bullet, number, toggle, code, page ⌘ βŒ₯ 4 to 9
Blocks
Action Shortcut
Select the current block Esc
Select all blocks ⌘ A twice
Duplicate ⌘ D
Move up / down ⌘ ⇧ ↑ / ↓
Delete selected Backspace
Copy, cut, paste blocks ⌘ C / X / V

How it works

flowchart LR
    subgraph UI["Interface"]
        Shell["Tabs, sidebar, topbar"]
        Editor["Block editor<br/>one contentEditable per block"]
        Views["Database views<br/>table, board, list, gallery,<br/>calendar, timeline"]
    end
    subgraph Core["Document core"]
        Store[("Store<br/>pages and blocks")]
        History["Undo and redo"]
    end
    Shell --> Store
    Editor --> Store
    Views --> Store
    Store --> History
    Store --> Disk[("localStorage")]
Loading

OpenNotion is a React 19 and TypeScript app built with Vite. There is no backend: a small store keeps every page and block in memory, records each change for undo, and saves to localStorage a moment after you stop typing.

src/
β”œβ”€β”€ store/        Document model, actions, undo history, persistence, tabs
β”œβ”€β”€ editor/       Block editor: caret logic, keys, slash menu, toolbar, drag and drop
β”œβ”€β”€ database/     Database views, property editors, filters, sorts, side peek
β”œβ”€β”€ components/   Sidebar, topbar, home, search, settings, templates, pickers
β”œβ”€β”€ lib/          HTML sanitizing, Markdown import and export, syntax highlighting
└── styles/       Theme tokens and component styles for light and dark

Roadmap

  • Block editor with slash menu, Markdown shortcuts and drag and drop
  • Databases with six views, filters, sorts and side peek
  • Tabs, search, templates, trash, light and dark themes
  • Installable app with offline caching (PWA)
  • Import a Notion workspace export (Markdown and CSV)
  • Formulas, relations and rollups
  • Optional sync server and real time collaboration
  • Mobile layout
  • Plugin API

Have an idea? Open an issue.

Contributing

Contributions are welcome, from bug reports to new block types.

  1. Fork the repo and create a branch.
  2. npm install and npm run dev.
  3. Make your change and run npm run build to type check and build.
  4. Open a pull request describing what changed and why. Screenshots help for UI changes.

Please keep pull requests focused, match the existing code style, and check both light and dark themes for visual changes.

FAQ

Is OpenNotion affiliated with Notion?

No. OpenNotion is an independent open source project and is not affiliated with, endorsed by, or sponsored by Notion Labs, Inc. See the disclaimer.

Where is my data stored, and how do I back it up?

In your browser's localStorage, on your device only. Use Settings β†’ Import and export to download a JSON backup and restore it later or in another browser.

Does it contact any other servers?

Only the host that serves the app, for its own files. There is no analytics, error reporting or font host. An image you add by link, or an older workspace that already stores an image link (the starter workspace used to link Unsplash photos), is fetched from that image's site when the page is shown, and nothing is rewritten for you. The Referrer-Policy: no-referrer header stops your page address from being sent along.

Can I use it with my team?

Not yet. Each browser has its own workspace. An optional sync server for real time collaboration is on the roadmap.

Why are AI chat and meetings shown but not working?

They need a server. They are kept as placeholders so the layout feels complete, and may be wired to a self hosted backend in the future.

Disclaimer

OpenNotion is an independent, unofficial open source project built for learning and personal use. It is not affiliated with, endorsed by, sponsored by or otherwise connected to Notion Labs, Inc. "Notion" and related names are trademarks of Notion Labs, Inc. and appear here only to describe what this project is an alternative to. This repository does not include Notion's source code, logos or artwork.

The software is provided "as is", without warranty of any kind, as stated in the MIT License. The author accepts no responsibility or liability for data loss, damages or any other issue that comes from using it. Everything is stored in your own browser, so please keep your own backups.

If you represent Notion Labs, Inc. or any other rights holder and have a concern about this project, please open an issue or contact the author. Concerns will be addressed promptly, including renaming the project or taking the repository and demo offline if requested.

Credits

  • Icons from Lucide (ISC License)
  • Covers in the starter workspace are illustrations generated for this project
  • Inter by The Inter Project Authors (SIL Open Font License 1.1), served from this site
  • Built with React, TypeScript and Vite

License

MIT Β© 2026 Brayden Siew


OpenNotion logo
If OpenNotion is useful to you, a star helps other people find it.

About

An open source Notion alternative that runs entirely in your browser. Pages, blocks and databases with no account and no server.

Topics

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages