A modern AI-powered Markdown workspace for writing, formatting, and exporting beautiful documents directly from your browser.
Live Demo • Features • Templates • AI Copilot • Getting Started
Markdown Studio is a next-generation Markdown editor that combines powerful writing tools, live document rendering, custom styling, AI-assisted content generation, and professional export capabilities into a single seamless workspace.
Whether you're creating:
- Documentation
- Technical specifications
- Project proposals
- Product requirements
- Meeting notes
- Resumes
- README files
- Knowledge base articles
Markdown Studio helps you move from idea → polished document in minutes.
- Live split-screen editor and preview
- Instant rendering while typing
- GitHub-flavored Markdown support
- Syntax highlighting
- Keyboard-first workflow
- Responsive design for desktop and mobile
Generate, improve, rewrite, summarize, and expand content directly inside the editor.
Supported providers:
- OpenAI
- Anthropic Claude
- Google Gemini
- Groq
- OpenRouter
- Custom OpenAI-Compatible APIs
Capabilities:
- Content generation
- Technical writing
- Grammar improvement
- Documentation drafting
- README generation
- Content summarization
- Writing assistance
Transform plain Markdown into beautifully designed documents.
Features include:
- Live CSS customization
- Custom themes
- Typography controls
- Print-friendly layouts
- Branded document styling
- Professional report formatting
One-click export to multiple formats:
| Format | Supported |
|---|---|
| Markdown (.md) | ✅ |
| ✅ | |
| DOCX | ✅ |
Generate polished deliverables without leaving the browser.
Jumpstart your writing with ready-made templates.
Available templates:
- README
- Resume
- Meeting Notes
- Technical Specification
- Product Requirement Document
- Project Proposal
- Documentation
- Blog Draft
- Research Notes
Your content remains under your control.
- Local-first editing experience
- No mandatory account creation
- No server-side document storage
- AI requests only occur when configured by the user
- Bring your own API keys
React 19
TypeScript
Vite
CodeMirror
Tailwind CSS
ZustandOpenAI
Anthropic
Gemini
Groq
OpenRouter
Custom Providershtml2pdf.js
docx
file-savermarkdown-studio
│
├── src
│ ├── components
│ ├── editor
│ ├── preview
│ ├── templates
│ ├── ai
│ ├── export
│ ├── store
│ ├── hooks
│ ├── services
│ └── styles
│
├── public
├── docs
└── assets
- Node.js 18+
- npm / pnpm / yarn
Clone the repository:
git clone https://github.com/your-username/markdown-studio.gitMove into the project:
cd markdown-studioInstall dependencies:
npm installStart development server:
npm run devBuild for production:
npm run buildPreview production build:
npm run previewMarkdown Studio supports multiple AI providers.
Configure your preferred provider inside the application settings.
Optional environment variable:
VITE_API_KEY=your_api_key_hereWithout this variable, users can connect their own providers directly from the UI.
Most Markdown editors focus on editing.
Most AI tools focus on generating.
Markdown Studio combines both.
You get:
- Professional writing environment
- AI-powered assistance
- Custom document styling
- Multiple export formats
- Browser-based workflow
- Privacy-first architecture
All in a single workspace.
- Markdown Editor
- Live Preview
- AI Copilot
- PDF Export
- DOCX Export
- Templates
- Custom CSS
- Collaborative Editing
- Version History
- Cloud Sync
- Team Workspaces
- Document Sharing
- Presentation Mode
- AI Document Designer
- Template Marketplace
Contributions, ideas, and feature requests are welcome.
# Fork repository
# Create feature branch
git checkout -b feature/amazing-feature
# Commit changes
git commit -m "Add amazing feature"
# Push branch
git push origin feature/amazing-featureOpen a Pull Request and we'll review it.
MIT License