npm bundle license docs
banner

Carta
Swiftly edit and render Markdown, with no overhead.

Documentation ยท GitHub

# Introduction Carta is a **lightweight**, **fast** and **extensible** Svelte Markdown editor and viewer, based on [Marked](https://github.com/markedjs/marked). Check out the [examples](http://beartocode.github.io/carta/examples) to see it in action. Differently from most editors, Carta includes neither ProseMirror nor CodeMirror, allowing for an extremely small bundle size and fast loading time. ## Features - Keyboard **shortcuts** (extensible); - Toolbar (extensible); - Markdown syntax highlighting; - Scroll sync; - Accessibility friendly; - **SSR** compatible; - **Katex** support (plugin); - **Slash** commands (plugin); - **Emojis**, with included search (plugin); - **Tikz** support (plugin); - **Attachment** support (plugin); - **Anchor** links in headings; - Code blocks **syntax highlighting** (plugin). ## Packages | Package | Status | Docs | | ----------------------------------------------------------------------------- | ----------------------------------------------------------------------------- | ---------------------------------------------------------------------------- | | [carta-md](https://www.npmjs.com/package/carta-md) | ![carta-md](https://img.shields.io/npm/v/carta-md) | [/](https://beartocode.github.io/carta/introduction) | | [plugin-math](https://www.npmjs.com/package/@cartamd/plugin-math) | ![plugin-math](https://img.shields.io/npm/v/@cartamd/plugin-math) | [/plugins/math](https://beartocode.github.io/carta/plugins/math) | | [plugin-code](https://www.npmjs.com/package/@cartamd/plugin-code) | ![plugin-code](https://img.shields.io/npm/v/@cartamd/plugin-code) | [/plugins/code](https://beartocode.github.io/carta/plugins/code) | | [plugin-emoji](https://www.npmjs.com/package/@cartamd/plugin-emoji) | ![plugin-emoji](https://img.shields.io/npm/v/@cartamd/plugin-emoji) | [/plugins/emoji](https://beartocode.github.io/carta/plugins/emoji) | | [plugin-slash](https://www.npmjs.com/package/@cartamd/plugin-slash) | ![plugin-slash](https://img.shields.io/npm/v/@cartamd/plugin-slash) | [/plugins/slash](https://beartocode.github.io/carta/plugins/slash) | | [plugin-tikz](https://www.npmjs.com/package/@cartamd/plugin-tikz) | ![plugin-tikz](https://img.shields.io/npm/v/@cartamd/plugin-tikz) | [/plugins/tikz](https://beartocode.github.io/carta/plugins/tikz) | | [plugin-attachment](https://www.npmjs.com/package/@cartamd/plugin-attachment) | ![plugin-attachment](https://img.shields.io/npm/v/@cartamd/plugin-attachment) | [/plugins/attachment](https://beartocode.github.io/carta/plugins/attachment) | | [plugin-anchor](https://www.npmjs.com/package/@cartamd/plugin-anchor) | ![plugin-anchor](https://img.shields.io/npm/v/@cartamd/plugin-anchor) | [/plugins/anchor](https://beartocode.github.io/carta/plugins/anchor) | ## Community plugins | Plugin | Description | | ----------------------------------------------------------------------------- | ---------------------------------- | | [carta-plugin-video](https://github.com/maisonsmd/carta-plugin-video) | Render online videos | | [carta-plugin-imsize](https://github.com/maisonsmd/carta-plugin-imsize) | Render images in specific sizes | | [carta-plugin-subscript](https://github.com/maisonsmd/carta-plugin-subscript) | Render subscripts and superscripts | | [carta-plugin-ins-del](https://github.com/maisonsmd/carta-plugin-ins-del) | `` and `` tags support | # Getting started > [!WARNING] > Sanitization is not dealt with by Carta. You need to provide a `sanitizer` in the options. > Common sanitizers are [isomorphic-dompurify](https://www.npmjs.com/package/isomorphic-dompurify) (suggested) and [sanitize-html](https://www.npmjs.com/package/sanitize-html). ## Installation Core package: ``` npm i carta-md ``` Plugins: ``` npm i @cartamd/plugin-name ``` ## Basic configuration ```svelte ``` # Documentation For the full documentation, examples, guides and more checkout the [website](https://beartocode.github.io/carta/). - [Introduction](https://beartocode.github.io/carta/introduction) - [Examples](https://beartocode.github.io/carta/examples) - [Getting Started](https://beartocode.github.io/carta/getting-started) - [Editing Styles](https://beartocode.github.io/carta/editing-styles) - Plugins: - [Math](https://beartocode.github.io/carta/plugins/math) - [Code](https://beartocode.github.io/carta/plugins/code) - [Emoji](https://beartocode.github.io/carta/plugins/emoji) - [Slash](https://beartocode.github.io/carta/plugins/slash) - [TikZ](https://beartocode.github.io/carta/plugins/tikz) - [Attachment](https://beartocode.github.io/carta/plugins/attachment) - [Anchor](https://beartocode.github.io/carta/plugins/anchor) - API: - [Utilities](https://beartocode.github.io/carta/api/utilities) - [Core](https://beartocode.github.io/carta/api/core) - [Extension](https://beartocode.github.io/carta/api/extension) # Contributing & Development Every contribution is well accepted. If you have a feature request you can open a new issue. This package uses a [pnpm workspace](https://pnpm.io/workspaces), so pnpm is required to download and put everything together properly. ### Committing This repository is [commitizen](https://github.com/commitizen/cz-cli) friendly. To commit use: ``` npm run commit # or, if you have commitizen installed globally git cz ``` ### Running docs If you want to preview the docs: ``` cd docs npm run dev ```