https://github.com/lucascorpion/prismjs-darcula-theme

PrismJS Darcula syntax highlighting theme based on the JetBrains IDEs.
https://github.com/lucascorpion/prismjs-darcula-theme

css darcula darcula-theme dark gatsby gatsby-remark-prismjs jetbrains prismjs scss syntax-highlighting-theme theme

Last synced: 26 days ago
JSON representation

PrismJS Darcula syntax highlighting theme based on the JetBrains IDEs.

• Host: GitHub
• URL: https://github.com/lucascorpion/prismjs-darcula-theme
• Owner: LucaScorpion
• License: mit
• Created: 2019-07-20T15:02:13.000Z (over 5 years ago)
• Default Branch: main
• Last Pushed: 2024-08-23T14:05:04.000Z (4 months ago)
• Last Synced: 2024-11-25T12:02:11.354Z (27 days ago)
• Topics: css, darcula, darcula-theme, dark, gatsby, gatsby-remark-prismjs, jetbrains, prismjs, scss, syntax-highlighting-theme, theme
• Language: SCSS
• Homepage: https://npmjs.com/package/prismjs-darcula-theme
• Size: 129 KB
• Stars: 7
• Watchers: 2
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.txt

Awesome Lists containing this project

README

        
# PrismJS Darcula Theme

[![npm](https://img.shields.io/npm/v/prismjs-darcula-theme.svg)](https://www.npmjs.com/package/prismjs-darcula-theme)

[![license](https://img.shields.io/npm/l/prismjs-darcula-theme.svg)](https://www.npmjs.com/package/prismjs-darcula-theme)

A syntax highlighting theme for [PrismJS] based on the Darcula theme from the [JetBrains] IDEs.

## Examples

![Example screenshot](screenshot.png)

Check out more examples and other languages on [GitHub pages](https://lucascorpion.github.io/prismjs-darcula-theme).

## Usage

### HTML

Download and include the compiled stylesheet in the `head` of your html:

```html

```

### Astro

Install the package:

```shell

npm install prismjs-darcula-theme

```

Ensure you are using the `prism` syntax highlighting mode in `astro.config.mjs`:

```js

import { defineConfig } from 'astro/config';

export default defineConfig({

  markdown: {

    syntaxHighlight: 'prism',

  },

});

```

Add this to your component:

```js

import 'prismjs-darcula-theme/darcula.css';

```

### Gatsby

This theme can be used in Gatsby with [gatsby-remark-prismjs].

Install the package using:

```shell

npm install prismjs-darcula-theme

```

Add this import to `gatsby-browser.js`:

```js

import 'prismjs-darcula-theme/darcula.css';

```

## Development

Run `npm run docs:watch` to watch `darcula.scss` for file changes, compiling it to `docs/darcula.css`.

To compile the file without watching for changes, use `npm run docs`.

Open `docs/index.html` in your browser to view the results.

[PrismJS]: https://prismjs.com

[JetBrains]: https://www.jetbrains.com

[gatsby-remark-prismjs]: https://www.gatsbyjs.org/packages/gatsby-remark-prismjs

[gatsby-plugin-sass]: https://www.gatsbyjs.org/packages/gatsby-plugin-sass