This theme switch dark mode for TikTok and uses a random imagem from unsplash each time you open the website.
TikTok Random Image Bg Theme by joaoricardorm
Details
Authorjoaoricardorm
LicenseNo License
Categoryuserstyles
Created
Updated
Size24 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name TikTok Galaxy Theme
@namespace USO Archive
@author YAD
@description `Since TikTok have already implemented its own darkmode this theme will be changed to a galaxy theme. 😊<a href="https://www.paypal.com/donate?hosted_button_id=LT8MPNTJU66HL" target="_blank"><b>DONATE VIA PAYPAL</b></a>`
@version 20221118.20.1
@license NO-REDISTRIBUTION
@preprocessor uso
==/UserStyle== */
@-moz-document domain("tiktok.com") {
/*body,
.main-body,
[class*="DivBodyContainer"] [class*="DivLiveContentContainer"] [class*="DivLiveFeedPage"] {
bbackground: var(--wallpa1);
}*/
body::before,
.main-body::before,
[class*="DivBodyContainer"] [class*="DivLiveContentContainer"] [class*="DivLiveFeedPage"] {
content: "";
background: var(--wallpa1);
position: fixed;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
opacity: 0.2;
width:100%;
height:100%;
}
body a {
color: #fff;
}
body a:hover {
color: #61a1cf;
}
[id="app"][style*="background-image:url"] {
background: #25232e !important;
}
[data-e2e="tiktok-logo"] [fill="#000000"],
[id="svg-header-logo"] [fill="black"] {
fill: #fff;
}
.logo-container .logo-link,
.logo-container-drawer .logo-link,
[class="logo-img"] [alt="TikTok Logo"],
[class="flex rtl:flex-row-reverse"] img,
[src*="/logo-whole"] {
filter: invert(1);
}
[id="svg-header-logo"] [fill="#25F4EE"] {
fill: #e05809;
}
.tiktok-header .hamburger-menu .hamburger-menu-wrapper span,
.tiktok-header.transparent .hamburger-menu:not(.hamburger-menu-active) .hamburger-menu-wrapper span,
.tiktok-header.transparent_with_border .hamburger-menu:not(.hamburger-menu-active) .hamburger-menu-wrapper span {
background: #fff !important;
}
* {
font-family: Default !important;
color: #fff !important;
caret-color: #38b1f7 !important;
text-shadow: 0 1px 4px rgba(6,2,2,0.831);
text-shadow: 0 0 0;
}
@font-face {
font-family: Decision Making;
src: url("https://fonts.cdnfonts.com/s/83762/DecisionmakingRegular-L3WRW.woff");
}
@font-face {
font-family: Special Elite;
src: url("https://fonts.gstatic.com/s/specialelite/v18/XLYgIZbkc4JPUL5CVArUVL0ntnAOSA.woff2");
}
@font-face {
font-family: Silkscreen;
src: url("https://fonts.gstatic.com/s/silkscreen/v1/m8JXjfVPf62XiF7kO-i9YLNlaw.woff2");
}
@font-face {
font-family: Zay;
src: url("https://fonts.cdnfonts.com/s/81381/Zay.woff");
}
@font-face {
font-family: Led Panel Station;
src: url("https://fonts.cdnfonts.com/s/80091/Led Panel Station On.woff");
}
@font-face {
font-family: The Hand of Tes;
src: url("https://fonts.cdnfonts.com/s/79649/The Hand of Tes.woff");
}
@font-face {
font-family: Oswald;
src: url("https://fonts.gstatic.com/s/oswald/v49/TK3_WkUHHAIjg75cFRf3bXL8LICs13FvsUZiZQ.woff2");
}
@font-face {
font-family: Jura;
src: url("https://fonts.gstatic.com/s/jura/v24/z7NOdRfiaC4Vd8hhoPzfb5vBTP0D7ZumR_g.woff2");
}
@font-face {
font-family: Custom-Font;
src: url(" Font URL Here ");
}
[class*="StyledTmpLink"] [fill*="rgba(22"] {
fill: #fff;
}
.tiktok-header .menu-wrapper .menu-item-link a::after,
[class*="DivTabsNavContainer"] [class*="DivTabInk"] {
background: var(--accyad);
}
[data-e2e*="nav"][class*="StyledTmpLink"] [fill*=" 85"],
[data-e2e*="nav"][class*="StyledTmpLink"] [fill*=" 59"],
[data-e2e*="nav"][class*="StyledTmpLink"] [fill*=" 92"] {
fill: var(--accyad);
}
[class*="-DivDiscoverItemContainer"],
[class*="-DivUpload "],
[class*="-DivScrollContainer-StyledScroll"] {
background: transparent;
}
[class*="tiktok-web-header"],
[class*="header-container white middle"],
[class*="header-container white"],
[class*="-DivHeaderContainer "],
.css-3a41nb,
.tiktok-header,
.header-container,
.bg-neutral-50,
.css-1b8asef {
background: var(--headyad) !important;
}
.css-3a41nb {
box-shadow: 0 0 0;
}
[class*="DivBodyContainer"] [class*="DivMainContainer"] [class*="DivTabsContainer"] {
background: var(--bgcyad);
}
.css-121llc2,
.search-container .search-input,
[class*="DivSearchFormContainer"] [class*="search-input"] {
background: rgba(6,2,2,0.102);
box-shadow: 0 0 0 1px rgba(221,221,221,0.039);
}
.css-yi6z9::after,
.css-vfauje::after {
background: transparent;
}
.header-inbox.header-inbox .content-wrap,
[class*="DivHeaderInboxContainer"] [class*="DivHeaderInboxWrapper"],
[data-e2e="report-icon"][class*="IActionButton"] [class*="DivContainer"],
[data-e2e="share-icon"][class*="IActionButton"] [class*="DivContainer"],
[data-e2e="sug-container"][class*="-DivContainer"],
.search-container .sug-container,
[class*="-DivContainer "][style*="background-color"] {
background: rgba(41,18,65,0.839) !important;
box-shadow: 0 2px 5px 2px rgba(6,2,2,0.302) !important;
}
[class*="content"] [class*="inner"][role="tooltip"] {
background: rgba(41,18,65,0.839) !important;
}
[class="tiktok-ftsest-DivHeaderInboxWrapper e18kkhh49"] {
background: rgba(41,18,65,0.839);
box-shadow: 0 2px 5px 2px rgba(6,2,2,0.302);
}
[class*="DivKeyboardShortcutContainer"],
[data-e2e="user-card"][class*="DivUserCardContainer"],
[data-e2e="user-profile-card"],
[class*="DivFeedTabsWrapper"] [class*="DivFeedTabs"],
[class*="DivProfileOuterContainer"] [class*="DivProfileContainer"] {
background: rgba(41,18,65,0.839) !important;
box-shadow: 0 2px 5px 2px rgba(6,2,2,0.302);
}
/***************************************/
/*Tiktok Galaxy Theme by YAD*/
/*****************2022******************/
[class*="DivModalContainer"] [class*="DivContentContainer"] {
background: transparent;
}
.inbox-content-header .inbox-content-header span,
.header-inbox .inbox-content-header span,
[data-e2e="inbox-bar"] [class*="SpanGroupItem"] {
background: rgba(6,2,2,0.149) !important;
}
.inbox-content-header span.selected {
background: rgba(6,2,2,0.58) !important;
}
.notification-item .avatar img {
background: transparent;
}
[data-e2e="inbox-bar"] [class*="xlvtk4"] {
background: rgba(6,2,2,0.58) !important;
}
[class*="DivUnreadTipsContainer"] [class*="DivUnreadTipsContent"] {
background: #0a9cf1;
}
[class*="DivMentionSuggestionContainer"] [class*="DivContainer"],
[class*="DivMentionSuggestionContainer"] [class*="DivContainer"] [class*="DivItemBackground"] {
background: rgba(41,18,65,0.839);
}
[class*="DivMentionSuggestionContainer"] [class*="DivContainer"] [class*="DivItemBackground"]:hover {
background: rgba(6,2,2,0.149);
}
[class*="DivBodyContainer"] [class*="DivBrowserModeContainer"],
[class*="DivBrowserModeContainer"] [class*="DivCommentListContainer"],
[class*="DivBottomCommentContainer"],
[class*="DivCommentContainer"] {
background: var(--wallpa1);
}
[data-e2e="comment-input"][class*="DivInputAreaContainer"] {
background: rgba(6,2,2,0.102);
}
[fill="#FE2C55"],
[data-e2e="browse-like-icon"] [fill*="rgba(254"],
[data-e2e="comment-like-icon"] [fill*="rgba"] {
fill: var(--accyad);
}
[role="dialog"] [class*="DivLeaveModalContainer"] {
background: var(--bgcyad);
}
[role="dialog"] [class*="DivFormBox"],
[class*="FormReport"] {
background: rgba(41,18,65,0.839) !important;
box-shadow: 0 2px 5px 2px rgba(6,2,2,0.302);
}
[class*="DivRadioWrapper"] [class*="DivFooter"] {
background: rgba(41,18,65,0.839);
}
[class*="DivUser"] [class*="UlUser"] {
background: rgba(41,18,65,0.839);
box-shadow: 0 2px 5px 2px rgba(6,2,2,0.302);
}
[class*="-UlUser "] [class*="-LiUser"]:hover,
[class*="LabelRadio"]:hover {
background: rgba(255,255,255,0.188);
}
[placeholder="Search for user name"] {
background: rgba(6,2,2,0.58);
border-radius: 22px;
padding: 10px;
}
[class*="tiktok-gnvmc3-Button"] {
background: var(--accyad);
}
[class*="tiktok-1svsmd8-Button"] {
box-shadow: 0 0 0 1px var(--accyad);
}
.atsx-btn-primary,
[class*="Button-StyledLogInButton"],
[data-e2e="card-followbutton"],
[class*="DivHeadActions"] [class*="StyledSubscriptionButton"],
[class*="Button-StyledDownloadButton"],
[class*="DivRankSettingsModal"] [class*="Button-StyledButton"],
[data-e2e="top-viewers-send"][class*="Button-StyledGiftButton"],
[data-e2e="gift-item"] [class*="Button-StyledGiftSend"],
[class*="DivCoinContainer"] [class*="Button"],
[data-e2e="block-popup-block-btn"][class*="Button-StyledButtonBlock"],
[data-e2e="edit-profile-save"][class*="Button-StyledBtn"],
[class*="follow-button-wrap button"] [class*="tiktok-btn-pc tiktok-btn-pc-tiny tiktok-btn-pc-primary"],
[role="user-card-operator-button"] [class*="Button"],
[class*="Button-StyledLoginButton"],
[data-e2e="nav-login-button"][class*="Button-StyledLogin"],
[class*="DivButtonsContainer"] [class*="Button-StyledButton"],
[class*="DivShareFollowContainer"] [class*="DivMessageContainer"] [class*="Button-StyledMessageButton"],
[class*="DivReportReasonFooter"] [class*="DivReportReasonButtonContainer"] [class*="Button"],
[class*="DivContainer"] [class*="DivButtonContainer"] [class*="Button-StyledButtonConfirm"],
[class*="DivContainer"] [class*="DivButtonContainer"] [class*="Button-StyledButtonCancel"],
[class*="DivButtonContainer"] [class*="DivConfirmButton"],
[class*="DivFooter"] [class*="ButtonSubmit"],
[class*="DivErrorContainer"] [class*="Button-StyledButton"],
[class*="ButtonFinish"],
[type="button"][data-e2e="user-card-follow"],
[type="button"][class*="Button-StyledFollowButton"],
.css-u3nkkc {
background-color: var(--accyad) !important;
color: #fff !important;
border: 0px solid rgba(255,255,255,0) !important;
box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.451) !important;
}
.atsx-btn-pri...