/* Title: Oxygen Code Editor Theme Type: CSS > Compile SCSS Code Location: Custom Hooks Hook name: oxygen_enqueue_ui_scripts Priority: 10 */ #oxygen-ui { .cm-s-default { &.CodeMirror { background-color: #263238 !important; color: rgba(233, 237, 237, 1) !important; font-size:15px !important; } .CodeMirror-gutters { background: #263238 !important; color: rgb(83, 127, 126) !important; border: none !important; } .CodeMirror-guttermarker, .CodeMirror-guttermarker-subtle, .CodeMirror-linenumber { color: rgb(83, 127, 126); } .CodeMirror-cursor { border-left: 1px solid #f8f8f0; } div.CodeMirror-selected, &.CodeMirror-focused div.CodeMirror-selected, .CodeMirror-line::selection, .CodeMirror-line::-moz-selection, .CodeMirror-line > span::selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::selection, .CodeMirror-line > span > span::-moz-selection { background: rgba(255, 255, 255, 0.15) !important; } .CodeMirror-activeline-background { background: rgba(0, 0, 0, 0.2); } .cm-keyword { color: rgba(199, 146, 234, 1); } .cm-operator { color: rgba(233, 237, 237, 1); } .cm-variable-2 { color: #80cbc4; } .cm-variable-3, .cm-type { color: #82b1ff; } .cm-builtin { color: #decb6b; } .cm-atom { color: #f77669; } .cm-number { color: #f77669; } .cm-def { color: rgba(233, 237, 237, 1); } .cm-string { color: #c3e88d; } .cm-string-2 { color: #80cbc4; } .cm-comment { color: #dcedc8; } .cm-variable { color: #82b1ff; } .cm-tag { color: #80cbc4; } .cm-meta { color: #80cbc4; } .cm-attribute { color: #ffcb6b; } .cm-property { color: #80cbae; } .cm-qualifier { color: #decb6b; } .cm-variable-3, .cm-type { color: #decb6b; } .cm-tag { color: rgba(255, 83, 112, 1); } .cm-error { color: rgba(255, 255, 255, 1); background-color: #ec5f67; } } }
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter