Custom theme JSFiddle

I prefer the dark theme in any IDE I work with, so I thought, there has to be a way to enable a dark theme for JSFiddle.
Well, kinda?!

It’s a bit hacky, but it gets the job done.

What we need to do is run a JS snippet in chrome dev tools, which alters the look of the JSFiddle editor.

Here we go:

Step 1:

Open your JSFiddle editor window here: https://jsfiddle.net/

Step 2:

Windows:

Hit f12 to open chrome dev tools.

Mac:

Hit ‘Cmd + Opt + I’ to open chrome dev tools.

Open ‘Sources’ tab
Click the ‘Snippets’ tab in top left and choose ‘New Snippet’

snippet




Step 3:

Give the snippet a name. You can see I called mine ‘dark theme jsfiddle’.

Step 4:

Paste in the contents of the following file

More themes available here: https://userstyles.org/styles/browse/jsfiddle

DarraghCustom theme JSFiddle