💡Dark Mode for Editor.JS

See original GitHub issue
  1. Describe a problem. Many of the modern applications now support dark mode and since editor.js is getting popular, It would be fantastic to have a ready-to-use dark mode configuration.

  2. Describe the solution you’d like.

const editor = new EditorJS({
  // ...
  theme: 'dark'
})

We can decide the colors as we move ahead.

Issue Analytics

  • State:open
  • Created 3 years ago
  • Comments:9 (1 by maintainers)

github_iconTop GitHub Comments

3reactions
neSpecccommented, Feb 16, 2021

Something like that? Made in 2 mins by custom style overrides.

photo_2021-02-16_23-59-29

1reaction
Eonasdancommented, Nov 30, 2022

I updated my previous comment. I must have fixed the other styles at some point. As far as a light/dark, media queries could do that based on the users preferred theme. If you have a toggle button, something like this might help: https://css-tricks.com/updating-a-css-variable-with-javascript/

Read more comments on GitHub >

github_iconTop Results From Across the Web

Custom UX/UI · Issue #822 · codex-team/editor.js - GitHub
I understand that the presence of a css variables and a wrapper with a theme class is sufficient in most cases. But now...
Read more >
6. Editor with Dark Theme
You can create an instance with the following code and use `getHtml()` and `getMarkdown()` of the [Editor](https://github.com/nhn/tui.editor). ```js.
Read more >
Simple dark mode switching with local storage & OS setting ...
A very bare bones script for adding "dark mode" to a site. Includes a customizable button, remembers a user's setting between pages and...
Read more >
storybook-dark-mode Addon
This plugin will apply a dark and light class name to the manager. This allows you to easily write dark mode aware theme...
Read more >
Using Dark Mode in your react app! - DEV Community 👩‍💻👨‍💻
Dark mode is one of the features that would look excellent implemented in your app, as it would improve the user experience inside...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found