Skip to content

Instantly share code, notes, and snippets.

@jackiboi307
Created May 25, 2021 16:43
Show Gist options
  • Save jackiboi307/5827b3b46f9ddf0a0e099811099b83b4 to your computer and use it in GitHub Desktop.
Save jackiboi307/5827b3b46f9ddf0a0e099811099b83b4 to your computer and use it in GitHub Desktop.
Discord CSS before redesign (taken from web app)
element.style {
}
::placeholder, body, button, input, select, textarea {
font-family: var(--font-primary);
text-rendering: optimizeLegibility;
}
::-webkit-input-placeholder, body, button, input, select, textarea {
font-family: var(--font-primary);
text-rendering: optimizeLegibility;
}
.appMount-3lHmkl, body {
background-color: var(--background-tertiary);
text-rendering: optimizeLegibility;
}
.appMount-3lHmkl, body, html {
height: 100%;
width: 100%;
}
body {
line-height: 1;
margin: 0;
padding: 0;
font-family: var(--font-primary);
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background: transparent;
}
a, abbr, acronym, address, applet, big, blockquote, body, caption, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, form, h1, h2, h3, h4, h5, h6, html, iframe, img, ins, kbd, label, legend, li, object, ol, p, pre, q, s, samp, small, span, strike, strong, table, tbody, td, tfoot, th, thead, tr, tt, ul, var {
margin: 0;
padding: 0;
border: 0;
font-weight: inherit;
font-style: inherit;
font-family: inherit;
font-size: 100%;
vertical-align: baseline;
}
user agent stylesheet
body {
display: block;
margin: 8px;
}
Style Attribute {
font-size: 87.5%;
}
[data-popout-root].newBrand, html.newBrand {
--brand-experiment-100: #f7f7fe;
--brand-experiment-130: #f0f1fe;
--brand-experiment-160: #e7e9fd;
--brand-experiment-200: #dee0fc;
--brand-experiment-230: #d4d7fc;
--brand-experiment-260: #c9cdfb;
--brand-experiment-300: #bcc1fa;
--brand-experiment-330: #a8aff8;
--brand-experiment-360: #949cf7;
--brand-experiment-400: #7984f5;
--brand-experiment-430: #707bf4;
--brand-experiment-460: #6571f3;
--brand-experiment: #5865f2;
--brand-experiment-500: #5865f2;
--brand-experiment-530: #505cdc;
--brand-experiment-560: #4752c4;
--brand-experiment-600: #3c45a5;
--brand-experiment-630: #343b8f;
--brand-experiment-660: #2d347d;
--brand-experiment-700: #232861;
--brand-experiment-730: #21265b;
--brand-experiment-760: #1e2353;
--brand-experiment-800: #1a1e49;
--brand-experiment-830: #141738;
--brand-experiment-860: #0d0f24;
--brand-experiment-900: #04050c;
--brand-experiment-05a: rgba(88,101,242,0.05);
--brand-experiment-10a: rgba(88,101,242,0.1);
--brand-experiment-15a: rgba(88,101,242,0.15);
--brand-experiment-20a: rgba(88,101,242,0.2);
--brand-experiment-25a: rgba(88,101,242,0.25);
--brand-experiment-30a: rgba(88,101,242,0.3);
--brand-experiment-35a: rgba(88,101,242,0.35);
--brand-experiment-40a: rgba(88,101,242,0.4);
--brand-experiment-45a: rgba(88,101,242,0.45);
--brand-experiment-50a: rgba(88,101,242,0.5);
--brand-experiment-55a: rgba(88,101,242,0.55);
--brand-experiment-60a: rgba(88,101,242,0.6);
--brand-experiment-65a: rgba(88,101,242,0.65);
--brand-experiment-70a: rgba(88,101,242,0.7);
--brand-experiment-75a: rgba(88,101,242,0.75);
--brand-experiment-80a: rgba(88,101,242,0.8);
--brand-experiment-85a: rgba(88,101,242,0.85);
--brand-experiment-90a: rgba(88,101,242,0.9);
--brand-experiment-95a: rgba(88,101,242,0.95);
--font-display: Ginto,"Helvetica Neue",Helvetica,Arial,sans-serif;
--control-brand-foreground: var(--control-brand-foreground-new);
}
.theme-dark, .theme-light {
--text-warning: #faa61a;
--text-danger: #ed4245;
--info-positive-background: rgba(59,165,92,0.1);
--info-positive-foreground: #3ba55c;
--info-warning-background: rgba(250,166,26,0.1);
--info-warning-foreground: #faa61a;
--info-danger-background: rgba(237,66,69,0.1);
--info-danger-foreground: #ed4245;
--status-positive-background: #3ba55c;
--status-positive-text: #fff;
--status-warning-background: #faa61a;
--status-danger-background: #ed4245;
--status-danger-text: #fff;
--focus-primary: #00b0f4;
}
.theme-dark {
--header-primary: #fff;
--header-secondary: #b9bbbe;
--text-normal: #dcddde;
--text-muted: #72767d;
--text-link: #00b0f4;
--text-positive: #4fdc7b;
--interactive-normal: #b9bbbe;
--interactive-hover: #dcddde;
--interactive-active: #fff;
--interactive-muted: #4f545c;
--background-primary: #36393f;
--background-secondary: #2f3136;
--background-secondary-alt: #292b2f;
--background-tertiary: #202225;
--background-accent: #4f545c;
--background-floating: #18191c;
--background-mobile-primary: #36393f;
--background-mobile-secondary: #2f3136;
--background-modifier-hover: rgba(79,84,92,0.16);
--background-modifier-active: rgba(79,84,92,0.24);
--background-modifier-selected: rgba(79,84,92,0.32);
--background-modifier-accent: hsla(0,0%,100%,0.06);
--info-positive-text: #fff;
--info-warning-text: #fff;
--info-danger-text: #fff;
--info-help-background: rgba(0,176,244,0.1);
--info-help-foreground: #00b0f4;
--info-help-text: #fff;
--status-warning-text: #000;
--scrollbar-thin-thumb: #202225;
--scrollbar-thin-track: transparent;
--scrollbar-auto-thumb: #202225;
--scrollbar-auto-track: #2e3338;
--scrollbar-auto-scrollbar-color-thumb: #202225;
--scrollbar-auto-scrollbar-color-track: #2f3136;
--elevation-stroke: 0 0 0 1px rgba(4,4,5,0.15);
--elevation-low: 0 1px 0 rgba(4,4,5,0.2),0 1.5px 0 rgba(6,6,7,0.05),0 2px 0 rgba(4,4,5,0.05);
--elevation-medium: 0 4px 4px rgba(0,0,0,0.16);
--elevation-high: 0 8px 16px rgba(0,0,0,0.24);
--logo-primary: #fff;
--control-brand-foreground: #a5b3e7;
--control-brand-foreground-new: #949cf7;
--background-mentioned: rgba(250,166,26,0.1);
--background-mentioned-hover: rgba(250,166,26,0.08);
--background-message-hover: rgba(4,4,5,0.07);
--channels-default: #8e9297;
--guild-header-text-shadow: 0 1px 1px rgba(0,0,0,0.4);
--channeltextarea-background: #40444b;
--activity-card-background: #202225;
--textbox-markdown-syntax: #8e9297;
Show All Properties (10 more)
}
<style>
:root {
--font-primary: Whitney,"Helvetica Neue",Helvetica,Arial,sans-serif;
--font-display: Whitney,"Helvetica Neue",Helvetica,Arial,sans-serif;
--font-code: Consolas,"Andale Mono WT","Andale Mono","Lucida Console","Lucida Sans Typewriter","DejaVu Sans Mono","Bitstream Vera Sans Mono","Liberation Mono","Nimbus Mono L",Monaco,"Courier New",Courier,monospace;
--font-korean: Whitney,"Apple SD Gothic Neo","NanumBarunGothic","맑은 고딕","Malgun Gothic",Gulim,굴림,Dotum,돋움,"Helvetica Neue",Helvetica,Arial,sans-serif;
--font-japanese: Whitney,Hiragino Sans,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,Osaka,"MS PGothic","Helvetica Neue",Helvetica,Arial,sans-serif;
--font-chinese-simplified: Whitney,"Microsoft YaHei New",微软雅黑,"Microsoft Yahei","Microsoft JhengHei",宋体,SimSun,"Helvetica Neue",Helvetica,Arial,sans-serif;
--font-chinese-traditional: Whitney,"Microsoft JhengHei",微軟正黑體,"Microsoft JhengHei UI","Microsoft YaHei",微軟雅黑,宋体,SimSun,"Helvetica Neue",Helvetica,Arial,sans-serif;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment