Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/lowmess/lowmess-prism. PrismJS theme for me to use on my website or whatever
prismjs syntax-theme
Something went wrong. Try again.
lowmess-prism theme.css
2.3 kB · 141 lines
CSS
at master
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142/** * lowmess theme for `prism.js` * @author Alec Lomas (@lowmess) */
:root { --black: hsl(35, 10%, 15%); --gray: hsl(35, 10%, 55%); --light-gray: hsl(35, 10%, 75%); --white: hsl(35, 10%, 95%); --orange: hsl(35, 90%, 50%); --red: hsl(5, 90%, 70%); --ice: hsl(185, 85%, 75%); --blue: hsl(215, 85%, 75%); --olive: hsl(125, 90%, 75%); --gold: hsl(65, 40%, 60%); --lavender: hsl(275, 90%, 80%);
--warning: hsl(5, 90%, 50%);}
@media only screen { code[class*="language-"], pre[class*="language-"] { background-color: var(--black); color: var(--white); direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; -moz-tab-size: 2; -o-tab-size: 2; tab-size: 2; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; }
/* Code blocks */
pre[class*="language-"] { overflow: auto; }
.token.comment, .token.prolog, .token.doctype, .token.cdata { color: var(--gray); font-style: italic; }
.token.atrule, .token.punctuation { color: var(--lightGray); }
.token.operator { color: var(--gold); }
.token.namespace { opacity: 0.8; }
.token.keyword { color: var(--red); }
.token.class-name { color: var(--light-gray); }
[language="language-jsx"] .token.class-name, [language="language-tsx"] .token.class-name { color: var(--blue); }
.token.tag { color: var(--blue); }
.token.number { color: var(--ice); }
.token.attr-name, .token.string, .token.char, .token.builtin, .token.inserted { color: var(--red); }
[language="language-css"] .token.string,[language="language-sass"] .token.string,[language="language-scss"] .token.string,[language="language-less"] .token.string { color: var(--olive); }
.token.variable { color: var(--lavender); }
.token.entity { color: var(--gold); }
.token.selector, .token.attr-value { color: var(--orange); }
.token.function { color: var(--lavender); }
.token.regex { color: var(--red); }
.token.important { color: var(--warning); font-weight: 700; }
.token.bold { font-weight: 700; }
.token.italic { font-style: italic; }
.token.entity { cursor: help; }}