Lets you change the color on Twitter to whatever you want!
Twitter Color Changer by aubymori
Details
Authoraubymori
LicenseUnlicense
Categorytwitter
Created
Updated
Size4.7 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
⚠️ MAKE SURE TO SET YOUR COLOR IN TWITTER'S DISPLAY OPTIONS TO ORANGE! ⚠️
Source code
/* ==UserStyle==
@name Twitter Color Changer
@namespace aubymori
@version 1.3.0
@description Allows you to change the Twitter color
@author aubymori
@license Unlicense
@preprocessor less
@var checkbox notice "⚠️ Make sure to set your Twitter color to Orange! ⚠️" 0
@var color color "Color" #1D9BF0
@var checkbox btnfix "Color Tweet buttons" 1
@var checkbox folfix "Color Follow buttons" 1
@var checkbox colnav "Color navigation items" 1
==/UserStyle== */
@-moz-document domain("twitter.com"), domain("x.com") {
/**
* Any text/icon colored orange
* as well as SVG elements colored
* orange (such as loading icon)
*/
[style*="color: rgb(255, 122, 0"],
[style*="stroke: rgb(255, 122, 0"],
:not([style*="-7.5px"]) > .r-5c1b6u:not(.r-1h0z5md),
[stroke="#FF7A00"],
.r-5c1b6u {
color: @color !important;
stroke: @color !important;
}
/* Selected DM */
.r-9tgftk {
border-right-color: @color;
}
/* Who can reply background */
.r-fovk4y {
background: darken(@color, 50%);
}
/* Toggle background */
[style*="rgb(255, 173, 97)"] {
background: lighten(@color, 10%) !important;
}
/* Slider background */
[style*="rgb(255, 189, 128)"] {
background: lighten(@color, 20%) !important;
}
/* Border color */
[style*="border-color: rgb(255, 122, 0"] {
border-color: @color !important;
}
/* Textbox */
.r-1a58od1 {
caret-color: @color;
}
/* Any button background colored orange */
[style*="background-color: rgb(255, 122, 0)"],
.r-2r9icm,
.r-tmwc1p {
background: @color !important;
}
/* New notification flash */
.r-kp635f {
background: rgba(@color, .14);
}
/* Selected poll option */
.r-1079r16 {
background: rgba(@color, .58);
}
/* Button hover */
.r-oo8a77 {
background: darken(@color, 10%);
}
/* Button active */
.r-2f19ci {
background: darken(@color, 20%);
}
/* Text button hover */
.r-1nvazc9 {
background: rgba(@color, .1);
}
/* Text button active */
.r-gz9rms {
background: rgba(@color, .2);
}
/* Tab key navigation focus border */
.r-14pf6q4,
.r-1cm1fuq{
box-shadow: lighten(@color, 10%) 0 0 0 2px inset;
}
/* Searchbox */
.r-14u09jm {
border-color: @color;
}
::selection {
background: @color;
color: white;
}
/* Settings categories */
.r-1c4dmg9 {
border-right-color: @color;
}
/* Sidebar Tweet button */
[data-testid="SideNav_NewTweet_Button"],
[data-testid="tweetButton"],
[data-testid="tweetButtonInline"] {
& when (@btnfix = 1) {
background: @color !important;
& > div, svg {
color: white !important;
}
&.r-jc7xae {
background: darken(@color, 10%) !important;
}
}
}
:root when (@folfix = 1) {
[data-testid$="-follow"],
[data-testid="editProfileButton"],
[data-testid="userActions"],
[data-testid="userActions"] + button,
[data-testid="sendDMFromProfile"],
[data-testid="sendDMFromProfile"] + div > button {
background-color: transparent !important;
border-color: @color !important;
&.r-jc7xae, &.r-pjtv4k {
background-color: rgba(@color, .1) !important;
}
&, & > div, svg {
color: @color !important;
}
}
[data-testid$="-unfollow"] {
border-color: @color !important;
background-color: @color !important;
&.r-qqmkd0 {
background-color: #f4212e !important;
border-color: #f4212e !important;
}
&, & > div, svg {
color: white !important;
}
}
}
nav:has([data-testid="AppTabBar_Home_Link"]) {
& > a:has(.r-b88u0q) svg,
.r-b88u0q {
color: @color !important;
}
}
}