Introduction

Nindo is a modern, extensible Markdown editor built with React and powered by Shadcn UI. it provides a seamless writing experience with live preview, keyboard shortcuts, and a powerful block-based architecture.

Why Nindo?

Markdown-First: Write in plain text, see rich results in real-time
Lightweight: Minimal dependencies, maximum performance
Customizable: Full theming support with Tailwind CSS
Production-Ready: Built for real-world blogging platforms and CMSs
Keyboard-First: Extensive shortcuts for power users

Key Features

Live Preview

Real-time markdown rendering powered by react-markdown, displayed side-by-side with your editor. You can use another tool to preview markdown, it's opt to you.

Block-Based Architecture

Every line of markdown is parsed into a block (heading, paragraph, code, quote, list), enabling context-aware toolbars and smart operations.

Smart Shortcuts

Type # + Space for headings, - + Space for lists, and more. Auto-pairing for brackets, quotes, and markdown syntax.

Easily add custom formatting actions, from simple text transformations to complex block operations.

Use Cases

Blog Platforms: Full-featured post editor with auto-save
Documentation Sites: Technical writing with code syntax highlighting
Note-Taking Apps: Personal knowledge management systems
CMS Integration: Headless CMS markdown editor
Collaborative Tools: Real-time collaborative editing (with extensions)

Philosophy

Nindo follows a textarea-first approach instead of contentEditable, providing:

Predictable cursor behavior across browsers
Simple state management
Native undo/redo support
Easy integration with any React application

Ready to get started? Let's configure Nindo!