Facebook - Dark Mode Expanded by blyad
Details
Authorblyad
LicenseCC BY-NC-SA 4.0
Categoryfacebook
Created
Updated
Size50 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
A couple customization options
Professional Thumbnail Creation 👍
Update 9 | 03.06.23
- fixes everywhere
Update 8 | 09.10.22
- fixed more shit broken by facebook
- added option to hide Reels
Update 7 | 05.10.22 | Pora zrobić rozpierdol w Arasraka Tower
- fixed most things that facebook fucked up
- added
translucent header
option - minor fixes
Update 6 | 03.09.22 | O Matko Jebanie..
- final polish of custom accent coloration
- even more fixes due to facebook interfierence
Update 5 | 25.08.22
- polished custom accent coloration
- fixed another dozen of bugs made by facebook
Update 4 | 22.08.22 | It starts with..
- added ability to change accent color
- fixed a lot of issues that were made due to facebook changes, too lazy to list them
Update 3 | 24.06.22 | >mfw
- corrected new login page
- corrected poll checkboxes
- something else, but I don't remember what and neither do I care to remember
Update 2 | 03.05.22
- changed another login page to dark
- corrected a few issues with current rules
- changed something more to dark idk
Update 1 | 14.04.22
- changed to dark reset password page
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Facebook - Dark Mode Expanded
@namespace github.com/blyad2137/facebook-dark-mode-expanded
@version 1.1.7
@description `Expanded Dark Mode covers everything that still remains white and corrects some present issues on the site.`
@author blyad (https://github.com/blyad2137)
@license CC BY-NC-SA 4.0
@homepageURL https://github.com/blyad2137/facebook-dark-mode-expanded
@supportURL https://github.com/blyad2137/facebook-dark-mode-expanded/issues
@preprocessor uso
@advanced dropdown disable-recommended "Recommended and Sponsored Stuff(on the right panel):" {
1. "HIDE" <<<EOT .rq0escxv.du4w35lb.o387gat7.qbu88020.pad24vr5.rirtxc74.dp1hu0rb.fer614ym.ni8dbmo4.stjgntxs.lpgh02oy.be9z9djy.hlyrhctz .l9j0dhe7.du4w35lb.rq0escxv.j83agx80.cbu4d94t.pfnyh3mw.d2edcug0.discj3wi, .rq0escxv.du4w35lb.o387gat7.qbu88020.pad24vr5.rirtxc74.dp1hu0rb.fer614ym.ni8dbmo4.stjgntxs.lpgh02oy.be9z9djy.hlyrhctz .cxgpxx05 > div:nth-of-type(1) > span > div > .l9j0dhe7, .kvgmc6g5.ad2k81qe.oygrvhab.f9o22wc5.oh7imozk.ox1siiyg.mz2297xg.qmfd67dx.cx39uazk.e3zsy2ct {display: none !important;} EOT;
2. "SHOW" <<<EOT EOT;
}
@advanced dropdown side-panels "Position of side panels:" {
1. "To the edge" <<<EOT .rq0escxv.du4w35lb.o387gat7.qbu88020.pad24vr5.rirtxc74.dp1hu0rb.fer614ym.ni8dbmo4.stjgntxs.lpgh02oy.be9z9djy.hlyrhctz, .bdao358l.g4tp4svg.svm27lag.q75x5y04.gz8zixbs.gszy8xml.fawcizw8.rw9272rg.lq84ybu9.hf30pyar.km253p1d.cofpoq2j.dbla2kx4, .x9f619.x1ja2u2z.xnp8db0.x112wk31.xnjgh8c.xxc7z9f.x1t2pt76.x1u2d2a2.x6ikm8r.x10wlt62.x7wzq59.xxzkxad.x1daaz14 {
position: fixed;
right: 0;
margin-right: 1em;
}
.rq0escxv.du4w35lb.o387gat7.qbu88020.pad24vr5.rirtxc74.dp1hu0rb.fer614ym.ni8dbmo4.stjgntxs.rek2kq2y.lpgh02oy.be9z9djy.bx45vsiw, .bdao358l.g4tp4svg.svm27lag.q75x5y04.gz8zixbs.gszy8xml.fawcizw8.rw9272rg.lq84ybu9.hf30pyar.sl4bvocy.km253p1d.cofpoq2j.h0j7qdxd, .x9f619.x1ja2u2z.xnp8db0.x112wk31.xnjgh8c.xxc7z9f.x1t2pt76.x1u2d2a2.x6ikm8r.x10wlt62.x1xzczws.x7wzq59.xxzkxad.x9e5oc1 {
position: fixed;
left: 0;
margin-left: 1em;
}EOT;
2. "To the center(OG)" <<<EOT EOT;
}
@advanced dropdown disable-known-people "No, I Do Not Know These People, now fuck off" {
1. "ON" <<<EOT .rq0escxv.l9j0dhe7.du4w35lb.pfnyh3mw.gs1a9yip.j83agx80.btwxx1t3.lhclo0ds.taijpn5t.sv5sfqaa.o22cckgh.obtkqiv7.fop5sh7t .rq0escxv.l9j0dhe7.du4w35lb.hpfvmrgz.buofh1pr.g5gj957u.aov4n071.oi9244e8.bi6gxh9e.h676nmdw.aghb5jc5.d8ncny3e.d2edcug0 .rq0escxv.l9j0dhe7.du4w35lb.hybvsw6c.io0zqebd.m5lcvass.fbipl8qg.nwvqtn77.k4urcfbm.ni8dbmo4.stjgntxs.sbcfpzgs[style] { display: none !important; } EOT;
2. "OFF" <<<EOT EOT;
}
@advanced dropdown reels "Reels:" {
1. "SHOW" <<<EOT EOT;
2. "HIDE" <<<EOT .x9f619.x1n2onr6.x1ja2u2z.x2bj2ny.x1qpq9i9.xdney7k.xu5ydu1.xt3gfkd.xh8yej3.x6ikm8r.x10wlt62.xquyuld[style*="border-radius: max(0px, min(8px, ((100vw - 4px) - 100%) * 9999)) / 8px;"] .x9f619.x1n2onr6.x1ja2u2z.x2bj2ny.x1qpq9i9.xdney7k.xu5ydu1.xt3gfkd.xh8yej3.x6ikm8r.x10wlt62.xquyuld[style*="border-radius: max(0px, min(8px, ((100vw - 4px) - 100%) * 9999)) / 8px;"] {display: none !important;} EOT;
}
@advanced color accent "Accent Color:" hsl(207, 92%, 58%)
@advanced text hue-rotate "Accent Color for Icons:" 191deg
@advanced dropdown custom-header "Translucent Header:" {
1. "ON" <<<EOT .x9f619.x1n2onr6.x1ja2u2z.x1ve1bff.x78zum5.xdt5ytf.x1s65kcs, .x9f619.x1ja2u2z.x1xzczws.x7wzq59[style*="z-index: 1"] .x9f619.x1n2onr6.x1ja2u2z.x78zum5.xl56j7k.x1qjc9v5.xozqiw3.x1q0g3np.x1ve1bff.xvo6coq.x2lah0s, .x9f619.x1ve1bff.x78zum5.xdt5ytf.x1s65kcs.x1r4l5d8.xds687c.xixxii4.x17qophe.x13vifvy.x1vjfegm {
background-color: rgba(var(--header-bg),var(--header-opacity));
backdrop-filter: blur(var(--header-blur)) saturate(1.6);
}
2. "OFF" <<<EOT EOT;
}
@advanced text header-opacity "Opacity of the Translucent Header:" 80%
@advanced text header-blur "Backdrop Blur of the Translucent Header:" 1rem
@advanced dropdown header-bg "Background Color of the Translucent Header:" {
1. "BG1" <<<EOT var(--bg-1-rgb) EOT;
2. "BG2" <<<EOT var(--bg-2-rgb) EOT;
3. "BG3" <<<EOT var(--bg-3-rgb) EOT;
4. "BG4" <<<EOT var(--bg-4-rgb) EOT;
}
==/UserStyle== */
@-moz-document domain("facebook.com") {
@import url('https://fonts.googleapis.com/css2?family=Maven+Pro&display=swap');
:root, .__fb-dark-mode {
--bg-1: #18191a;
--bg-1-rgb: 24, 25, 26;
--bg-2: #242526;
--bg-2-rgb: 36, 37, 38;
--bg-3: #3a3b3c;
--bg-3-rgb: 58, 59, 60;
--bg-4: rgba(11,11,11,.8);
--bg-4-rgb: 11,11,11;
--pt: #e4e6eb;
--st: #b0b3b8;
--border: #3e4042;
--accent: /*[[accent]]*/;
--link: var(--accent);
--base-blue: var(--accent);
--accent-rgb: 46, 137, 255;
--white-rgb: 255,255,255;
--header-opacity: /*[[header-opacity]]*/;
--header-bg: /*[[header-bg]]*/;
--header-blur: /*[[header-blur]]*/;
--invert-1: invert(96%) sepia(0%) saturate(6922%) hue-rotate(255deg) brightness(95%) contrast(75%);
--filter-accent: invert(40%) sepia(52%) saturate(200%) saturate(200%) saturate(200%) saturate(189%) hue-rotate(/*[[hue-rotate]]*/) brightness(103%) contrast(102%);
}
* {
font-family: 'Maven Pro', sans-serif !important;
}
body.UIPage_LoggedOut, body._605a {
background-color: var(--bg-1);
color: var(--pt);
}
#contentCurve, ._8icy ._8icz, ._5tkp, ._1hcb, ._9ai8 {
border-color: var(--border);
}
._95k9, ._1gax, ._4-u5, ._6s5d, ._8esf.gradient, ._97vt ._30ny, #contentCol, .uiBoxGray, ._4p8x, .lnqo2vjd, ._cue, ._1pig, .registration ._li._9bpz, ._9bq8, ._4mkt, ._1clg .inputtext, ._585r, .qsy8amke, ._io, html[id="facebook"], .e, div#u_c_1_Xa, .x6s0dn4.x443n21.x78zum5.xl56j7k.xt3ofjt {
background-color: var(--bg-1);
}
.x6s0dn4.x1q0q8m5.x1qhh985.xu3j5b3.xcfux6l.x14yjl9h.xudhj91.x18nykt9.xww2gxu.x26u7qi.xm0m39n.x13fuv20.x972fbf.x9f619.x78zum5.xdt5ytf.x1iyjqo2.xs83m0k.xl56j7k.xat24cr.x11i5rnm.x1mh8g0r.xdj266r.x2lwn1j.xeuugli.x6ikm8r.x10wlt62.x1n2onr6.x1ja2u2z.xs9asl8.x1mpkggp.x1t2a60a.x123j3cw.xd7y6wv.x23j0i4 {
background-color: var(--bg-1) !important;
}
#facebook ._8esf ._8e63, #facebook ._8esf ._58mk, ._c24, #facebook ._8esf ._52lp ._52lq, input, select, textarea, #facebook ._8esf ._5k_4 ._8esg, #facebook ._8esf ._5k_2 ._58mt, #facebook ._8it_ ._1v_x h2.uiHeaderTitle, .rs22bh7c, ._4-i0 ._52c9, ._15lg, #facebook ._8esj._8esf ._8eso, #facebook ._9kpl ._9kpo, .fcb, .CometSettingsPage #contentCol .uiHeader h2.uiHeaderTitle, .CometSettingsPage #contentCol .fbSettingsList h3, .CometSettingsPage #contentCol .fbSettingsEditor .fbSettingsEditorLabels, .CometSettingsPage #contentCol .fbSettingsList h3, .CometSettingsPage #contentCol .fbSettingsEditor .fbSettingsEditorLabel, ._42fu, .CometSettingsPage ._50f4, .CometSettingsPage ._39gj, .CometSettingsPage ._3o7u, ._50f7, ._3ksl, ._3ks9, ._3ksw, ._42al, ._tph ._tpl, .CometSettingsPage #contentCol .fsm, .CometSettingsPage #contentCol .fbSettingsEditorFields a[role='button'], .CometSettingsPage #contentCol h3, .fbSettingsList .fbSettingsListItemLabelWithSubtitle, .bq6qj4t2, .eitm9ape, ._55pe, ._19s-, ._2fvv, ._2x1i, ._2x1j, ._2x1p, h5._34h5, ._1clg .inputtext:focus, ._1clg .inputtext:active, ._1yhk, h3._34h5, ._59cz ._59c_ h4, ._52id, ._3x93 .uiList li, ._575j a:hover, .uiInputLabelLegacy label, ._2e9n, ._4-xi, ._5p3j, #facebook ._-kb h2, #facebook ._-kb h3, #facebook ._-kb h1, ._9o-g, ._9xo5 ._9xo6, ._9o-l, ._9si-, .pbevjfx6, .x4gvtve, .xayvuls, .do .dw, .b .cq a.cu:hover, .b .cq a.cu:focus, .b .cq a.cu, .dn, span.x1lliihq.x6ikm8r.x10wlt62.x1n2onr6.xlyipyv.xuxw1ft, body._6s5d._71pn.system-fonts--body.segoe, ._71iz {
color: var(--pt);
}
.fzdkajry {
fill: var(--pt);
}
#facebook ._8esf ._8e4l, #pageFooter, ._95ke #pageFooterChildren a, ._95ke .localeSelectorList a, #facebook ._8esf ._52lp ._52lr, #facebook ._8esf ._2_68, ._58mu ._58mv, ._83kf, #facebook ._8it_ ._1v_-, #facebook ._8n2m ._8n25, ._rzy, #facebook ._9kpl ._9kq2, .fcg, ._9ax- ._1rf8, .CometSettingsPage #contentCol .fbSettingsList .fbSettingsListItemContent, .CometSettingsPage #contentCol label, ._3sts, ._4p8z, ._50f8, ._33gq ._38my, ._5dwb ._38my, ._3ksa, ._2iex, .fbSettingsList .fbSettingsListItemSubtitle, .l6yax632, .CometSettingsPage .fbSettingsSectionsItemContent, .gufbqysq, ._54nc ._48u1, ._2x1k, ._5s9z, ._5s9z a, ._2vmy img, ._1clg .inputtext, ._1tvz, #facebook ._9np_ ._9o4e, #facebook ._9np_ ._9o1w, #facebook ._9np_ ._9ok8, ._erp label, ._yl9, ._3uxxj--container, #facebook ._9aha ._9ai4, ._25_a label, ._3sts label, .rtxb060y, a._39g5, .bt, .ei, ._8it_ ._2qyq {
color: var(--st);
}
._1gbd {
box-shadow: 0 0 0 1px var(--border);
}
._1gaz {
background-color: var(--bg-2);
width: auto !important;
}
._1gbd:hover {
box-shadow: 0 1px 8px 5px var(--border);
}
._6luv, ._csi:hover ._t7b, .cwj9ozl2 {
background-color: var(--bg-2);
}
html ._55r1 {
background-color: var(--bg-3);
border-color: var(--border);
color: var(--pt);
}
._517h, ._59pe:focus, ._59pe:hover {
background-color: var(--bg-2);
border-color: var(--border);
color: var(--st);
}
.sp_gMujFo71RwJ.sx_25f620, [src*="/__geKiQnSG-.png"], .sp_98fCI7IVTTz.sx_c4643a, [src*="/Family-Lockup-Inline_10_light.png"], .sp_-Ww9-2lZPiS.sx_3813d1, .sp_d_7d9pz5g6w, ._8bb_ img.monochrome, ._8bb_ i.monochrome, .sp_8s3dp67SKVi.sx_9e9cb0:not(.selected .sp_8s3dp67SKVi.sx_9e9cb0), .x14hiurz:not(.x1fsd2vl.xl56j7k.x170jfvy.x78zum5.x6s0dn4 div) i {
filter: invert(1) hue-rotate(180deg);
}
._9ls8, ._9ls9, .lzf7d6o1, [src*="/leave-door_filled_24_fds-black.png"], [src*="/language_filled_24_fds-black.png"], [src*="/settings_outline_24_fds-gray-40.png"], [src*="/shopping-bag_outline_24_fds-gray-40.png"], [src*="/shield_outline_24_fds-gray-40.png"], .dwxx2s2f.dicw6rsg.kady6ibp.rs0gx3tq:nth-of-type(3) .bp9cbjyn.j83agx80.taijpn5t.l9j0dhe7.datstx6m.k4urcfbm i.hu5pjgll.bixrwtb6:not(.rq0escxv.du4w35lb.ms05siws.pnx7fd3z.b7h9ocf4.pmk7jnqg.j9ispegn.kr520xx4.pedkr2u6.oqq733wu .dwxx2s2f.dicw...