Discord Tokyo Night

tokyo-night.css

/**
 * @name Tokyo Night
 * @author Nebula
 * @authorId 574669003755356162
 * @version 1.0.0
 * @description Tokyo Night theme from VSCode
 */

.theme-dark {
  --header-primary: var(--text-normal);
  --header-secondary: var(--text-muted);

  /*  Text Color  */
  --text-normal: #b1bae6;
  --text-muted: #565f89;
  --interactive-normal: #5f647e;
  --interactive-hover: #a2a6c2;
  --interactive-active: #b5bad1;
  --interactive-muted: #55576b;

  /* Background Color */
  --background-primary: #1a1b26;
  --background-secondary: #171722;
  --background-secondary-alt: #13131a;
  --background-tertiary: #16161e;
  --background-tertiary-alt: var(--background-secondary-alt);
  --background-accent: #434461;
  --background-floating: #161620;
  --background-modifier-hover: #212331c0;
  --background-modifier-active: #282a3680;
  --background-modifier-selected: #24263171;
  --background-modifier-accent: #1e1e29;
  --background-mentioned: #252836;
  --border-mentioned: #474c64;
  --background-mentioned-hover: #2f3344;
  --accent-color: #7aa2f7;

  /* Folder Color */
  --folder-color: #202332d0;
  --folder-color-light: #2f3342d0;

  /* Scrollbars Color */
  --scrollbar-thin-thumb: transparent;
  --scrollbar-thin-track: transparent;
  --scrollbar-auto-thumb: #2b2b46af;
  --scrollbar-auto-thumb-hover: #27273d85;
  --scrollbar-auto-track: transparent;
  --scrollbar-auto-scrollbar-color-thumb: var(--scrollbar-auto-thumb);
  --scrollbar-auto-scrollbar-color-track: var(--scrollbar-auto-track);

  /* Chat Box Color */
  --channeltextarea-background: var(--background-secondary);
  --channeltextarea-background-hover: var(--background-tertiary);
}

.body-2wLx-E, .headerTop-3GPUSF, .bodyInnerWrapper-2bQs1k, .footer-3naVBw {
    background-color: var(--background-tertiary);
}

.title-17SveM, .name-3Uvkvr{
    font-size: 14px;
}

.panels-3wFtMD {
    background-color: var(--background-secondary);
}

.username-h_Y3Us {
    font-family: var(--font-display);
    font-size: 14px;
}

.peopleColumn-1wMU14, .panels-j1Uci_, .peopleColumn-29fq28, .peopleList-2VBrVI, .content-2hZxGK, .header-1zd7se, .root-g14mjS .small-23Atuv .fullscreenOnMobile-ixj0e3{
    background-color: var(--background-secondary);
}

.textArea-12jD-V, .lookBlank-3eh9lL,  .threadSidebar-1o3BTy, .scrollableContainer-2NUZem, .perksModalContentWrapper-3RHugb, .theme-dark .footer-31IekZ, .theme-light .footer-31IekZ{
    background-color: var(--background-tertiary);
}

.numberBadge-2s8kKX, .base-PmTxvP, .baseShapeRound-1Mm1YW, .bar-30k2ka, .unreadMentionsBar-1Bu1dC, .mention-1f5kbO, .active-1SSsBb, .disableButton-220a9y {
    background-color: var(--ping) !important;
}

.lookOutlined-3sRXeN.colorRed-1TFJan, .lookOutlined-3sRXeN.colorRed-1TFJan {
    color: var(--ping) !important;
}

.header-3OsQeK, .container-ZMc96U {
    box-shadow: none!important;
    border: none!important;
}

.content-1gYQeQ, .layout-1qmrhw, .inputDefault-3FGxgL, .input-2g-os5, .input-2z42oC, .role-2TIOKu, .searchBar-jGtisZ {
    border-radius: 6px;
}

.layout-1qmrhw:hover, .content-1gYQeQ:hover {
    background-color: var(--background-modifier-selected)!important;
}

.container-3wLKDe {
    background-color: var(--background-secondary) !important;
}

.title-31SJ6t {
    background-color: var(--background-primary) !important;
}