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:

Step 2:


Hit f12 to open chrome dev tools.


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

Open ‘Sources’ tab
Click the ‘Snippets’ tab in top left and choose ‘New 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:

DarraghCustom theme JSFiddle