Skip to content

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

This theme switch dark mode for TikTok and uses a random imagem from unsplash each time you open the website.

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...

Reviews

No reviews yet.