---
title: Dark or Custom Theme
description: Change Jodit theme to dark or create your own custom theme.
keywords: dark theme, custom theme, jodit theme
---

# Dark or custom theme

Change the standard light theme of Jodit to dark or your own

Include Jodit

```html
<link rel="stylesheet" href="build/jodit.min.css" />
<script src="build/jodit.min.js"></script>
```

Create input element

```html
<textarea id="editor"></textarea>
```

Init Jodit

```javascript
const editor = Jodit.make('#editor', {
	theme: 'dark'
});
```

## Result

```html
<!-- Example Start -->
<textarea id="editor"></textarea>
<script>
	const editor = Jodit.make('#editor', {
		theme: 'dark'
	});
</script>
<!-- Example End -->
```

You can create self theme

```html
<style>
	.jodit_theme_summer {
		--jd-color-background-default: #417505;
		--jd-color-border: #474025;
		--jd-color-panel: #5fd3a2;
		--jd-color-icon: #8b572a;
	}
</style>
```

And use this theme

```javascript
Jodit.make('#summer', {
	theme: 'summer'
});
```

## Result

```html
<!-- Example Start -->
<style>
	.jodit_theme_summer {
		--jd-color-background-default: #417505;
		--jd-color-border: #474025;
		--jd-color-panel: #5fd3a2;
		--jd-color-icon: #8b572a;
	}
</style>
<textarea id="summer"></textarea>
<script>
	const editor = Jodit.make('#summer', {
		theme: 'summer'
	});
</script>

<!-- Example End -->
```