An open-source Electron desktop app and theme customizer for VS Code & Antigravity IDE Markdown previews.
💡 Inspiration & Story: This is a vibecoded app built using Antigravity IDE and Antigravity 2.0, powered by Claude for strong technical implementation planning while Antigravity executed the end-to-end task. The inspiration behind this project comes from daily use of Antigravity IDE—where default Markdown preview themes often felt generic and hard to read. This tool makes creating, customizing, and applying vibrant, readable Markdown preview themes effortless.
- Built-in Theme Gallery: Preview and apply curated dark and light themes (Midnight Dark, Cyberpunk Neon, Solarized Light, GitHub Light, Nord, Dracula, and more).
- Interactive Theme Customizer: Real-time token editor for 12 color variables (backgrounds, text, headings, links, code blocks, borders, blockquotes, etc.).
- Live Markdown Preview: Instant preview render using sample Markdown content.
- Custom Theme Management: Save custom theme presets locally, switch between them, or delete them.
- One-Click Installation: Install themes directly into any target VS Code / Antigravity project (
.vscode/settings.jsonand custom CSS output). - Workspace Project Registry: Tracks installed projects and active themes.
To get the full Markdown experience (Mermaid diagrams, LaTeX math equations, GFM task list checkboxes) inside VS Code, Antigravity IDE, or Cursor, ensure the following extensions are installed in your editor:
| Extension | Extension ID | Category | Purpose |
|---|---|---|---|
| Mermaid Diagram Engine | bierner.markdown-mermaid |
Diagrams | Renders flowcharts, sequence diagrams, git graphs, and architecture charts in native Markdown preview. |
| KaTeX Math Engine | goessner.mdmath |
Math & Equations | Fast, high-quality LaTeX math formula rendering for inline ($...$) and block ($$...$$) equations. |
| Markdown All in One | yzhang.markdown-all-in-one |
Formatting & Tasks | Enables GFM task list checkboxes (- [x]), table auto-formatting, and editor shortcuts. |
You can install all required extensions instantly via your terminal:
# For VS Code
code --install-extension bierner.markdown-mermaid
code --install-extension goessner.mdmath
code --install-extension yzhang.markdown-all-in-one
# For Antigravity IDE
antigravity --install-extension bierner.markdown-mermaid
antigravity --install-extension goessner.mdmath
antigravity --install-extension yzhang.markdown-all-in-one
# For Cursor
cursor --install-extension bierner.markdown-mermaid
cursor --install-extension goessner.mdmath
cursor --install-extension yzhang.markdown-all-in-one💡 Automatic Recommendation: When you install a theme into any project workspace via VS Markdown Theme Maker, these extensions are automatically added to your project's
.vscode/extensions.jsonrecommendation list so your IDE prompts you to install them with one click.
-
Clone the repository:
git clone https://github.com/Mightyiest/VS-Markdown-Theme-Maker.git cd VS-Markdown-Theme-Maker -
Install dependencies:
npm install
-
Run the application:
npm start
- Browse Your Project: Select your target VS Code / Antigravity project workspace folder.
- Apply or Create Theme:
- Choose a built-in theme from the gallery to apply directly.
- Or customize color tokens using the editor and click Save As New to create a custom theme.
- Manage Installed Projects & Themes:
- Access saved projects anytime from the left sidebar menu.
- Easily Reinstall, Uninstall, or switch themes for any saved project workspace.
To generate standalone Windows executables (saved locally in dist/ and excluded from git):
- Build Both (Portable & Installer):
npm run build
- Build Portable App Only:
npm run build:portable
- Build Setup Installer Only:
npm run build:installer
Run unit test suite:
npm testVS-Markdown-Theme-Maker/
├── src/
│ ├── main.js # Main process & IPC handlers
│ ├── preload.js # Context bridge API
│ ├── lib/ # Core business logic & theme utilities
│ │ ├── theme-tokens.js # Token extractor & CSS generator
│ │ ├── theme-registry.js # Built-in theme definitions
│ │ ├── theme-installer.js # VS Code project settings installer
│ │ ├── custom-themes.js # User theme persistence storage
│ │ └── project-registry.js # Installation tracker
│ └── renderer/ # UI Renderer process
│ ├── index.html # Desktop interface layout
│ └── themes/ # Built-in CSS theme files
├── test/ # Unit test suite
├── .gitignore # Git ignore settings
├── package.json # Project dependencies & scripts
└── LICENSE # MIT Open Source License
Contributions, feature suggestions, and pull requests are welcome!
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Distributed under the MIT License. See LICENSE for details.


0 comments
log in to comment.