Dracula Theme for Markdown

A dark theme for rendered markdown using the official Dracula color palette. Use it anywhere you display markdown: static sites, documentation, blogs, or custom markdown renderers.

Installation

<link rel="stylesheet" href="dracula-markdown.css">

Or use the scoped version with a container class:

<link rel="stylesheet" href="dracula-markdown-scoped.css">

<div class="dracula-markdown">
    <!-- Your markdown content -->
</div>

Text Formatting

Regular text looks like this. You can make text bold or italic, or even both. Here's some inline code and a link.

You can also use strikethrough, highlighted text, and keyboard inputs.

Blockquotes

The quick brown fox jumps over the lazy dog. This is a blockquote that shows how quoted text appears in the Dracula theme.

Blockquotes can contain multiple paragraphs and other elements.

Lists

Unordered

• First item
• Second item
  • Nested item one
  • Nested item two
• Third item

Ordered

1. First step
2. Second step
   1. Sub-step A
   2. Sub-step B
3. Third step

Task List

• Completed task
• Another done
• Still to do

Code

Inline

Use console.log() for debugging or npm install dracula-theme to install.

Block

function greet(name) {
    console.log(`Hello, ${name}!`);
    return true;
}

// Call the function
greet("Dracula");

Tables

Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Horizontal Rule

Content above the rule.

Content below the rule.

Details/Summary

Built with the official Dracula color specification.