/* ==UserStyle==
@name Google Catppuccin
@namespace github.com/catppuccin/userstyles/styles/google
@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/google
@version 2025.05.01.1
@updateURL https://github.com/keonly/userstyles/raw/main/styles/google/catppuccin.user.less
@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle
@description Soothing pastel theme for Google
@author Catppuccin
@license MIT
@preprocessor less
@var select lightFlavor "Light Flavor" ["latte:Latte", "frappe:Frappé", "macchiato:Macchiato", "mocha:Mocha*"]
@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappé", "macchiato:Macchiato", "mocha:Mocha*"]
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray*"]
==/UserStyle== */
@-moz-document regexp("^https?://(www\\.|images\\.)?google\\..*") {
:root {
@media (prefers-color-scheme: light) {
#catppuccin(@lightFlavor);
}
@media (prefers-color-scheme: dark) {
#catppuccin(@darkFlavor);
}
}
#catppuccin(@flavor) {
@rosewater: @catppuccin[@@flavor][@rosewater];
@flamingo: @catppuccin[@@flavor][@flamingo];
@pink: @catppuccin[@@flavor][@pink];
@mauve: @catppuccin[@@flavor][@mauve];
@red: @catppuccin[@@flavor][@red];
@maroon: @catppuccin[@@flavor][@maroon];
@peach: @catppuccin[@@flavor][@peach];
@yellow: @catppuccin[@@flavor][@yellow];
@green: @catppuccin[@@flavor][@green];
@teal: @catppuccin[@@flavor][@teal];
@sky: @catppuccin[@@flavor][@sky];
@sapphire: @catppuccin[@@flavor][@sapphire];
@blue: @catppuccin[@@flavor][@blue];
@lavender: @catppuccin[@@flavor][@lavender];
@text: @catppuccin[@@flavor][@text];
@subtext1: @catppuccin[@@flavor][@subtext1];
@subtext0: @catppuccin[@@flavor][@subtext0];
@overlay2: @catppuccin[@@flavor][@overlay2];
@overlay1: @catppuccin[@@flavor][@overlay1];
@overlay0: @catppuccin[@@flavor][@overlay0];
@surface2: @catppuccin[@@flavor][@surface2];
@surface1: @catppuccin[@@flavor][@surface1];
@surface0: @catppuccin[@@flavor][@surface0];
@base: @catppuccin[@@flavor][@base];
@mantle: @catppuccin[@@flavor][@mantle];
@crust: @catppuccin[@@flavor][@crust];
@accent: @catppuccin[@@flavor][@@accentColor];
color-scheme: if(@flavor = latte, light, dark);
iframe {
color-scheme: none !important;
}
::selection {
background-color: fade(@accent, 30%);
}
input,
textarea {
&::placeholder {
color: @subtext0 !important;
}
}
&,
body {
background: @base !important;
--uv-styles-color-surface: @crust;
--uv-styles-color-tertiary: @surface0;
--uv-styles-color-secondary: fade(@blue, 25%);
--uv-styles-color-primary: @base;
--uv-styles-color-on-primary: @blue;
--uv-styles-color-text-primary: @blue;
--uv-styles-color-icon-default: @text;
--uv-styles-color-text-emphasis: @text;
--uv-styles-color-icon-on-secondary: @subtext0;
--uv-styles-color-on-tertiary: @text;
--uv-styles-color-icon-on-tertiary: @text;
--uv-styles-color-scrim: fade(@crust, 75%);
--uv-styles-color-on-scrim: @text;
--uv-styles-color-icon-on-scrim: @text;
--xhUGwc: @base;
--bbQxAb: @text;
--IXoxUe: @subtext0;
--COEmY: @text;
--YLNNHc: @text;
--JKqx2: @blue;
--gS5jXb: @surface0;
--mXZkqc: @surface0;
--EpFNW: @mantle;
--XKMDxc: @mantle;
--TSWZIb: @mantle;
--tefdc5886c2f04483: @text;
--te8f1ea4d4928be48: @text !important;
--ta884a309a24f44f4: @subtext0 !important;
--tdee01b39543f1cac: @base !important;
--tcc8c9ef487836e2b: @surface0 !important;
--ta83cba65577ef850: @blue !important;
--t7d1a3050c2c1c0a5: @text !important;
--t6a0469853a1a02c1: @text !important;
--t5feec22832a0fdd6: @surface0 !important;
--t342c96645d13ae13: @accent !important;
--t6c7325fca9d536d4: @text !important;
--tf7148cf5018d5074: @text !important;
--t9ab8d922307d428d: @text;
--t62e84c71989f1975: @red !important;
--tc9db399ed82142e1: @green !important;
--uv-styles-color-text-default: @subtext0 !important;
--uv-styles-color-review-stars: @yellow !important;
--gm3-sys-color-primary: @surface0;
--gm3-sys-color-on-primary: @blue;
--Nsm0ce: @blue;
}
/* header background */
.CvDJxb {
background-color: @base !important;
}
/* safe search toggle dropdown */
.z4R3Z.yb2zA {
color: @blue !important;
}
.z4R3Z {
color: @text !important;
}
/* selected image background */
.PNCib.fT6ABc::after {
background-color: @surface1 !important;
border-color: @blue !important;
}
/* travel */
.Usd1Ac {
background-color: @surface0 !important;
border-color: @surface2 !important;
}
.P77izf {
background-color: @base !important;
color: @text !important;
}
.VfPpkd-StrnGf-rymPhb-f7MjDc,
.VfPpkd-qPzbhe-JNdkSc-Bz112c {
color: @accent !important;
}
.EL3pcf {
color: @accent !important;
}
.bVfPpkd-StrnGf-rymPhb,
.DMZ54e {
color: @text !important;
}
.VfPpkd-pafCAf,
.VfPpkd-pafCAf-OWXEXe-Xhs9z {
fill: @mantle !important;
}
.VfPpkd-l6JLsf::after {
background-color: @blue !important;
}
.VfPpkd-l6JLsf::before {
background-color: @surface2 !important;
}
.VfPpkd-uMhiad::after {
background: @overlay0;
}
.dmaMHc {
background-color: @surface0 !important;
}
.AJxgH {
background-color: @mantle !important;
}
.VfPpkd-cTi5dd {
color: @accent !important;
}
/* news column thingymaboober idk what it's actually called, but it's like these columns of news headlines so yeah */
.nEklgc {
background-color: @surface0;
}
.JJZKK.Wui1sd {
border-color: @surface0;
}
.rbYSKb,
.FuOudf,
.GI74Re {
color: @subtext0;
}
/* widgets */
/* timer */
.pMz3A,
.qhXOwb,
.yrvNxb .pv60Cd,
.LPl7kb .pv60Cd,
.Q7q8pf .pv60Cd {
background-color: @mantle !important;
}
/* color picker */
.P2c8Dd {
background-color: @base;
}
.R9RxHd {
border-color: @surface0;
}
/* unit converter */
.LNn04b {
background-color: @mantle;
color: @text !important;
border-color: @surface0;
}
.vXQmIe,
.vk_c {
color: @text !important;
border-color: @surface0 !important;
}
.NIzGle {
background-color: @yellow;
color: @crust;
}
/* periodic table */
.DJ3Gm {
background-color: @peach;
color: @crust;
}
.nA1S9d {
background-color: @mauve;
color: @crust;
}
.qY66Od {
background-color: @blue;
color: @crust;
}
.IJR6Te {
background-color: @sky;
color: @crust;
}
.asrVsb {
background-color: @surface0;
}
.VCIyZb {
background-color: @red;
color: @crust;
}
.QRbwTb {
background-color: @teal;
color: @crust;
}
.tASb2d {
background-color: darken(@red, 5%);
color: @crust;
}
.Fm9Me {
background-color: @yellow;
color: @crust;
}
.wo1y7c {
background-color: @green;
color: @crust;
}
/* search bar right beneath websites */
.YbqTTb,
g-flat-button.BwMo1 {
background-color: @base;
border-color: @surface0;
}
.YbqTTb:focus {
border-color: @accent;
}
/* some play buttons on games */
.fxvhbc,
.pGGGle {
background-color: @accent;
color: @crust;
}
/* calculator senpai~ */
.zRQJhd {
background-color: @base !important;
}
.XH1CIc {
color: @subtext0;
}
.pno7A.hU1rMc .Tqvz7b,
.pno7A.rfUaPd .SwDSDf {
color: @subtext1;
}
.pno7A.rfUaPd .Tqvz7b {
color: @text;
}
.tR3EBc {
background-color: @mantle;
}
.AOvabd,
.dxp44d {
background: @surface0 !important;
color: @text !important;
border-color: @surface0 !important;
&:hover {
background-color: @surface1;
border-color: @surface1;
}
}
.zbvg1c {
color: @text;
}
.UUhRt {
background-color: @blue;
color: @mantle;
border-color: @blue;
&:hover {
background-color: @sky;
border-color: @sky;
}
}
.tw-lliw.item-selected .language_list_item {
color: @blue;
}
.qv3Wpe {
color: @text;
}
.TIGsTb {
border-color: @surface0;
}
.TIGsTb:hover {
background-color: @surface0;
border-color: @surface0;
}
.MEdqYd,
.feqqG {
background: @surface2;
color: @text;
border-color: @surface2;
&:hover {
background-color: @overlay0;
border-color: @overlay0;
}
}
/* more button */
.CybWFf {
background-color: @surface0;
}
.Lu57id {
color: @subtext0;
}
/* live sports */
.Wrsj9b,
.ofy7ae,
.PPjCfd,
.lr-imso-fix {
background-color: @accent !important;
color: @crust !important;
}
.liveresults-sports-immersive__match-grid-bottom-border,
.liveresults-sports-immersive__match-grid-right-border,
.YENodc {
border-color: @surface0;
}
.liveresults-sports-immersive__match-tile:hover,
.KAIX8d:hover,
.kwbMAe {
background-color: @surface0;
}
.imspo_mt__dt-t,
.imspo_mt__pm-infc,
.GOsQPe {
color: @text !important;
}
/* knowoledge panel uwu */
.H73aad {
&,
&hover {
background-color: @mantle !important;
border-color: @surface0 !important;
}
}
.AQtWSd,
.ulmfef,
.xCBykf,
.m2E3md {
color: @blue;
}
.joHe2d {
background-color: @base !important;
box-shadow: 0 1px 0 @base !important;
}
.xt8Uw,
.ipwqjc,
.Bk8Hxd:link,
.ucRBdc,
.PDzHbe,
.pt3Hdf,
.Cv2Brc,
.IFGUre,
.review-dialog {
color: @text;
}
.GK1a5e {
background-color: @text;
}
.RC9d6e {
border-top-color: @text;
}
.IFmkIb.IFmkIb {
background-color: @surface0;
border-color: @surface2;
}
.ab_button {
background-image: linear-gradient(to top, @surface0, @base);
background-color: @surface0;
border-color: @surface1;
}
.PGbOqf {
background-color: @accent;
}
.yAbdSd {
color: @red;
}
.ycghLd {
background-color: @red;
border-color: @red;
}
.IRH78d,
.CFjcj,
.HkuhB {
color: @subtext0;
}
.l2gNXd {
background-color: @yellow;
}
.uVGhGc,
.hIqKNb {
background-color: @surface0;
}
.tcuWYc {
background-image: linear-gradient(
@overlay0 1px,
rgba(255, 255, 255, 0) 0
);
}
.qk7LXc.Fb1AKc,
.fAt9Jd,
.SME0md,
.ipwqjc {
background-color: @base !important;
}
.ttBXeb,
.NDTw3e.K7R36c,
.knowledge-finance-wholepage-chart__fw-uch .uch-svg {
color: @subtext0;
}
.sQ6RSc {
fill: @text;
}
.egcvbb {
border-color: @surface2;
&:hover {
border-color: @text;
}
}
.knowledge-finance-wholepage-chart__hover-card {
background-color: @base;
}
.knowledge-finance-wholepage-chart__hover-card-time {
color: @subtext0;
}
.fw-ch-sel .KWk7r.qUjgX {
background-color: @surface0;
color: @blue;
}
.gb_Ka.gb_f,
.gb_Na.gb_f,
#gb {
background-color: @base !important;
svg,
.gb_Rc svg,
.gb_dd .gb_ld,
.gb_3c .gb_ld {
color: @text;
}
}
.gb_Nc a.gb_F,
.gb_Nc span.gb_F {
color: @text;
}
.uU7dJb {
border-bottom-color: @surface0;
background-color: @mantle;
color: @subtext1;
}
.gb_Nc .gb_d:hover {
background-color: @surface0;
}
.KxwPGc {
background-color: @mantle;
}
.HJSKzf {
color: @text;
}
.gbqfba,
.lJ9FBc input[type="submit"] {
color: @text;
background-color: @surface0;
border-color: @surface1;
&:hover {
color: @text;
background-color: @surface0;
border-color: @surface2;
}
}
/* AI search */
.UxeQfc,
.s7d4ef,
.yXu61c,
.X6JNf,
.BERAof,
.oxbMzd,
.A5s9h,
.V9Wb7c,
.GVUPk,
.GyAeWb,
.A0hi5,
.Tme6jf {
background-color: @base !important;
}
.d3o3Ad,
.sZKvbe {
fill: @green !important;
}
.Fzsovc,
.cwYVJe,
.RJPOee,
.vM0jzc,
.clOx1e,
.vDF3Oc.vDF3Oc .R8BTeb,
.vDF3Oc.vDF3Oc .ouxCkc,
.Yt787,
.mulB1,
.xUc8Ie,
.sfgTZc,
.I6Kpxd,
.cQEt3 {
color: @text !important;
}
.yQLaje,
.tVoQIb,
.f9nOyf,
.kHtcsd,
.DopHqc,
.p7bv,
.ar9V1,
.DfMusf,
.y6CIle,
.JukT7c,
.xUc8Ie.BXdrne,
.sEqX7e,
.ZFiwCf {
background-color: @surface0 !important;
}
.xUc8Ie.BXdrne,
.YUg0se,
.WGbsof {
border-color: @surface2 !important;
}
.NOo3C {
color: @subtext1;
}
.WGbsof[selected] {
background-color: @blue;
border-color: @blue !important;
}
/* End of AI search */
/* "People also search for.." / "People also ask" section */
.vIifob,
.p8Jhnd {
background-color: @surface0 !important;
}
.vBnbff,
.RSWv0c.NaC7Cf,
.RSWv0c.NaC7Cf .q8U8x > div:nth-child(1) {
background-color: @surface0 !important;
color: @text !important;
}
.DxHbyd {
background-color: @surface2 !important;
}
.dg6jd {
color: @text !important;
}
/* mobile ui */
/* header background & search bar */
.v6U7rf {
background-color: @base;
}
.zGVn2e,
.u4frDf {
background: @surface0 !important;
}
/* search suggestions */
.K4VNlb,
.Sl6fgd.A7Yvie,
.Sl6fgd .zGVn2e,
.UUbT9 {
background-color: @surface0;
border-color: @surface0 !important;
}
.sb43 {
@svg: escape(
''
);
background-image: url("data:image/svg+xml,@{svg}");
}
/* text */
.SAuUUd-z5C9Gb-fmcmS,
.tJaMb,
.TElO2c,
.cQp1Ab {
color: @text !important;
}
.s49v2 {
b,
span {
color: @text !important;
}
}
.ob9lvb {
color: @subtext0;
}
/* borders */
.Dgr5Hb,
.GqbEwc {
border-color: @surface0 !important;
}
#gsr {
background-color: @mantle;
}
.Ww4FFb {
box-shadow: 0 0 0 1px @base;
}
.Faw6Fe,
.GpOXq {
border-color: @surface0 !important;
}
.zGVn2e,
.jh86Nb {
border-color: @surface1 !important;
}
/* Featured snippets */
@media (prefers-reduced-motion: no-preference) {
.c2xzTb .ILfuVd b {
background: linear-gradient(
90deg,
fade(@accent, 30%) 50%,
#0000 50%
) no-repeat 75% 0;
background-size: 200% 100%;
}
}
.pHiOh,
a.pHiOh {
color: @subtext1 !important;
}
a {
color: @blue;
}
.RNNXgb {
background: @surface0;
border-color: @surface1;
}
.RNNXgb:hover,
.sbfc .RNNXgb {
background: @surface0 !important;
border-color: @surface0;
box-shadow: 0 1px 6px 0 @crust;
}
.minidiv .RNNXgb {
background: @surface0;
border-color: @surface1;
&:hover {
box-shadow: 0 4px 12px @crust;
}
}
.HSryR .KsRP6 {
border-color: @surface2;
}
.emcav .RNNXgb {
box-shadow: 0 1px 6px 0 @crust;
background: @surface0;
border-color: @surface0;
}
.aajZCb {
background: @surface0;
box-shadow: 0 4px 6px 0 @crust;
}
.xtSCL {
border-top-color: @surface2;
}
.sbct:hover {
background-color: @surface1;
}
.WggQGd {
color: @mauve !important;
}
.JCHpcb {
color: @subtext0;
}
.JCHpcb:hover {
color: @blue;
}
.wM6W7d,
.ABAbCc {
color: @text;
}
.uDetx {
fill: @text;
}
.ExCKkf,
.BjWz4c {
color: @subtext0;
}
.ACRAdd {
border-left-color: @overlay0;
}
.Pvpvv {
background-color: @crust;
border-color: @surface1;
color: @text;
}
.w9dUj {
color: @text !important;
}
.Pvpvv .zE5Aq,
.adnFRd,
.XfJHbe {
color: @blue;
}
.CS4h3e {
background-color: @subtext0;
}
.Pvpvv .xyGai {
color: @text;
}
#SIvCob {
color: @text;
}
.gb_Jc a.gb_B,
.gb_Jc span.gb_B {
color: @text;
}
.gb_Jc svg,
.gb_Oc.gb_Sc svg,
.gb_Jc .gb_ad .gb_id,
.gb_Jc .gb_ad .gb_Ic,
.gb_Jc .gb_ad .gb_cd,
.gb_Oc.gb_Sc .gb_id {
color: @text;
}
.gb_Ka svg,
.gb_Oc svg,
.gb_ad .gb_id,
.gb_0c .gb_id {
color: @text;
}
.gLFyf {
color: @text;
}
.QCzoEc {
color: @overlay2;
}
.szppmdbYutt__middle-slot-promo {
color: @text;
}
.gb_Jc .gb_Ud button:hover svg,
.gb_Jc .gb_d:hover {
background-color: @surface0;
}
.gb_Jc .gb_Ud.gb_qe button:hover svg,
.gb_Ud button:hover svg,
.gb_d:hover {
background-color: @surface0;
}
.gb_We {
background: @mantle;
color: @text;
}
a.gb_B,
span.gb_B {
color: @text;
}
.gb_zc div:first-child {
color: @text;
}
.gb_zc > * {
color: @subtext0;
}
.ClJ9Yb {
color: @subtext0;
}
.sfbg {
background-color: @base;
}
.jfN4p,
.lnXdpd:not([src^="/logos/doodles/"]) {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
.aXBZVd {
@svg: escape(
''
);
background-image: url("data:image/svg+xml,@{svg}");
}
.zgAlFc {
color: @blue;
}
.fLciMb {
color: @text;
}
.d2IKib {
color: @red;
}
.fLciMb:hover {
background-color: @surface0;
}
.kno-ftr.rpBMYb {
color: @subtext0;
}
.aTI8gc {
color: @text;
}
.wwUB2c {
color: @subtext0;
}
.dhERQc {
color: @base !important;
background-color: @blue !important;
}
.z1asCe,
.ikb4Bb {
color: @subtext1 !important;
}
.rsGxI.Ww4FFb,
.Ww4FFb {
background-color: @base;
}
.RES9jf {
color: @text;
}
.CSkcDe,
.related-question-pair div.iDjcJe {
color: @text;
}
.cUnQKe .ILfuVd b,
.cUnQKe .QBI8hf b {
background-color: fade(@blue, 25%);
color: @text;
}
.cUnQKe .ILfuVd,
.cUnQKe .UiGGAb.ILfuVd {
color: @subtext1;
}
.ZYHQ7e {
color: @subtext0;
}
.VuuXrf {
color: @text;
}
.hb8SAc,
.gb_Oc a.gb_H,
.gb_Oc span.gb_H {
color: @text;
}
.TQc1id .I6TXqe {
border-color: @surface2;
}
.I6TXqe,
.zaokob {
background: @base;
}
.tw-lliw:hover,
.tw-lliw:focus {
background-color: @surface0;
}
.language_list_languages.tw-ll-top::after {
background: linear-gradient(to bottom, transparent, @base);
}
.HsZQAe {
border-bottom-color: @surface2;
}
.KLEmSd {
border-bottom-color: @surface1;
}
.NtaMpb .niO4u,
.nZWEZc .ttwCMe,
.xNzW0d,
.lWzCpb {
background-color: @base;
}
.aURkK {
border-left-color: @surface1;
}
.iRPzcb {
border-bottom-color: @surface1;
}
.related-question-pair .d0fCJc {
color: @text;
}
cite,
cite a:link,
cite a:visited {
color: @subtext0;
}
.WZ8Tjf,
.EZAeBe,
.F0gfrd {
color: @subtext0;
}
.yDYNvb.lyLwlc {
color: @text;
}
.H9lube {
background-color: @base;
border-color: @surface2;
}
.Bi9oQd {
background-color: @surface1;
}
.akqY6 {
background: @surface1;
}
.KFFQ0c .YfftMc,
.KFFQ0c .YfftMc span,
.KFFQ0c .YfftMc div,
.KFFQ0c .YfftMc a,
g-menu.DWsAYc g-menu-item a.K1yPdf,
.f3LoEf,
.TXBhSe:hover,
.TXBhSe:not(:hover),
.r025kc.lVm3ye,
.Bo9xMe,
.oyj2db {
color: @subtext0;
}
.dyjrff,
.LEwnzc {
color: @subtext1;
}
.ZFiwCf {
background-color: @surface0;
&:hover {
background-color: @surface1;
}
}
.LGwnxb,
.WGwSK {
color: @text;
}
.EsIlz {
background-color: @base;
border-color: @surface1;
}
.O7G3Gd {
color: @text;
&:hover {
color: @blue;
}
}
.appbar {
background: @base;
border-top-color: @surface1;
}
.bSeRjc:hover .fKmH1e {
color: @subtext1;
background-color: @surface0;
}
.bSeRjc:hover div[aria-expanded="true"] .fKmH1e,
div[aria-expanded="true"] .fKmH1e {
background-color: fade(@blue, 25%);
color: @blue;
}
.LHJvCe,
.vqseUe,
.dMCttd {
color: @subtext0;
}
.dG2XIf .xpdbox .yc7KLc {
background-color: @base;
}
.URgIvb {
border-color: @blue;
background-color: @blue;
}
.pdpvld {
color: @green;
}
.YrbPuc {
color: @subtext1;
}
.SRfaKe,
.SRfaKe h2 {
background-color: @mantle;
}
.y6CIle {
background-color: @surface0;
}
.Yt787,
.vDF3Oc.vDF3Oc .R8BTeb {
color: @text;
}
.IDFSOe {
background-color: @surface2;
}
.ffmmcd,
.u7yw9 .WeviRb {
border-color: @surface1;
}
.wdQNof {
border-color: @surface1;
background-color: @base;
}
.PewBWb {
border-top-color: @surface1;
}
.eadHV.Ses7yd {
color: @text !important;
}
.f,
.j04ED,
.j04ED a,
.j04ED a:link,
.XaIwc {
color: @subtext0 !important;
}
#_Xg6uZYKGBYCDhbIPvK2s2AI_27
> div:nth-child(3)
> g-right-button:nth-child(1)
> g-fab:nth-child(1),
g-right-button.wgbRNb > g-fab:nth-child(1) {
background-color: @crust !important;
}
.gb_2e {
background-color: @surface0;
}
.gb_Ec {
div:first-child {
color: @text;
}
> * {
color: @subtext0;
}
}
.kLhEKe {
background-color: @base;
}
.S8ee5.CwbYXd {
color: @text;
}
.S8ee5 {
background: @surface0;
}
.S8ee5:hover {
background: @surface1;
}
.rhHIGd {
background-color: @surface2;
}
.sY7ric {
color: @text;
}
.I6a0ee {
background-color: @base;
border-color: @surface2;
color: @text;
}
.I6a0ee:hover {
background-color: @mantle;
border-color: @surface2;
}
.I6a0ee:focus {
background-color: @crust;
border-color: @surface2;
}
.pxhZNb {
background-color: @surface0 !important;
color: @text;
}
.d2F2Td {
color: @text;
}
.c07z9 {
color: @subtext0;
}
.c07z9 a,
.c07z9 a:active,
.c07z9 a:link {
color: @text;
text-decoration-color: @subtext0;
}
.wHYlTd {
color: @subtext0;
}
.dG2XIf .c2xzTb .wDYxhc:first-child {
background: @base;
}
.fm06If .ILfuVd,
.c2xzTb .ILfuVd,
.Jb0Zif .c2xzTb .ILfuVd {
color: @text;
}
.fm06If .ILfuVd b,
.c2xzTb .ILfuVd b {
background-color: fade(@blue, 25%);
color: @text;
}
.GKS7s {
background: @surface0;
border-color: @surface1;
box-shadow: inset 0 0 0 1px @surface2;
}
.GKS7s:hover {
background-color: @surface1 !important;
border-color: @surface2;
}
.yXK7lf em {
color: @text;
}
.Lb0dA:hover {
background-color: @surface0;
}
.Lb0dA[aria-expanded="true"]:hover .EGarzf {
color: @blue;
}
.Lb0dA[aria-expanded="true"] {
background-color: fade(@blue, 25%);
}
.BaegVc:hover {
background-color: @surface0;
}
.hdtb-tl-sel .BaegVc {
background-color: fade(@blue, 25%);
}
.BaegVc:focus {
background-color: fade(@blue, 25%);
}
.TZqsAd {
background: @overlay0;
}
.FalWJb {
background: @base;
}
.YeThId {
border-top-color: @surface1;
}
.k8XOCe {
background-color: @surface0;
}
.s75CSd {
color: @text;
}
.ZkkK1e,
.uAbMZd {
background: @base;
border-color: @surface1;
&:hover {
background: @surface0;
}
}
.QjI2jc {
color: @subtext0;
}
.lhLbod {
color: @subtext0;
}
.nr7I6e div[aria-expanded="true"] .F75bid,
.nr7I6e div[aria-expanded="true"]:hover .fFI3rb .F75bid {
color: @blue;
}
.F75bid {
color: @subtext0;
}
div[aria-expanded="true"] .fFI3rb {
background-color: fade(@blue, 25%) !important;
}
div[aria-expanded="true"]:hover .fFI3rb:hover {
background-color: fade(@blue, 25%) !important;
}
.MAMMm {
background: @mantle;
box-shadow: 0 2px 6px @crust !important;
}
[selected].nWtjMe {
background: fade(@blue, 25%) !important;
}
.uZNuIf:hover {
background-color: @surface0;
color: @text;
}
[selected].nWtjMe .FMKtTb {
color: @text;
}
.nWtjMe .FMKtTb {
color: @subtext0;
}
.GKS7s .FMKtTb,
.GKS7s .RWhoyd.mol54e {
color: @text;
}
.ePSouf .FMKtTb {
color: @subtext0;
}
.NkCsjc:hover {
background-color: @surface0 !important;
color: @text;
}
.nr7I6e div[aria-haspopup="true"]:hover .F75bid {
color: @text;
}
a.hisnlb {
background: fade(@overlay2, 25%);
}
div[aria-expanded="true"] .fFI3rb,
div[aria-expanded="true"]:hover .fFI3rb:hover {
background-color: @surface0 !important;
}
.hdtb-tl-sel .BaegVc .WjMmQ:hover {
color: @blue;
}
.hdtb-mn-hd {
color: @subtext0;
}
.hdtb-mn-hd:hover {
color: @text;
}
.fSnalc {
stroke: @blue;
}
.oOg6Ne {
stroke: @yellow;
}
.ZqPjbb {
stroke: @red;
}
.aPiskd {
stroke: @green;
}
.s8GCU {
background-color: @base;
}
.Lj9fsd {
background-color: @base;
}
.jZWadf {
background-color: @base;
}
.rQEFy,
.rQEFy:hover {
border-color: fade(@blue, 25%);
background-color: fade(@blue, 25%);
}
.gbZSUe {
color: @text;
}
.gbZSUe:hover {
background: @surface0;
}
.XZ5MVe {
color: @blue;
}
a:visited {
color: @mauve;
}
.SvoXfb > .x5f7Bc {
fill: @subtext0;
}
.SvoXfb:hover > .x5f7Bc {
fill: @text;
}
.SvoXfb:hover {
background-color: @surface0;
}
.IsZvec,
.yxAsKe {
color: @subtext0;
}
.zqrO0.k0Jjg .QuU3Wb,
.zqrO0.k0Jjg:hover .QuU3Wb {
color: @subtext1;
}
.uo4vr {
color: @subtext0;
}
.minidiv .sfbg {
background: @base;
box-shadow: 0 1px 6px 0 @crust;
}
.aqCVJb {
background-color: @blue !important;
border-color: @blue !important;
}
.T8VaVe {
color: @blue;
}
.tw-ta,
#tw-source-text-container .tw-ta,
#tw-source-rmn-container .tw-ta {
color: @text;
}
.tw-bilingual-marked {
border-color: @blue;
}
#tw-target {
background-color: @surface0;
}
.tw-data-placeholder {
color: @text;
}
.j1iyq {
border-color: @surface2;
}
.w8qArf .fl {
color: @text !important;
}
.HSryR a.B1uW2d {
border-bottom-color: @surface2;
}
.usJj9c .zz3gNc {
color: @text;
}
.Ss2Faf a {
color: @text;
}
.aCOpRe em,
.yXK7lf em {
color: @text;
}
.FR7ZSc .niO4u {
background-color: @base;
border-color: @surface2;
color: @blue;
}
.g {
color: @text;
}
.VSHxQ {
color: @subtext0;
}
.cF4V5c {
background-color: @crust !important;
}
.cF4V5c g-menu-item a,
.cF4V5c g-menu-item a:visited,
.cF4V5c g-menu-item a:hover {
color: @text;
}
.cF4V5c:hover g-menu-item:hover a,
.cF4V5c:hover g-menu-item a:visited,
.cF4V5c g-menu-item a:hover {
background-color: @surface0;
}
.GZnQqe.LGiluc {
border-top-color: @surface2 !important;
}
.pkWBse {
box-shadow: 1px 1px 15px 0 @crust;
}
.dG2XIf {
background: @base;
border-color: @surface0 !important;
}
.Z0LcW {
color: @text;
}
.i29hTd .qLLird {
color: @text;
}
.i29hTd .kR7nSc {
color: @text;
}
.N6Sb2c {
color: @subtext0;
}
.C9iYEe {
color: @subtext0;
}
.KcXNxb {
background: @base;
}
.ss6qqb .PKDVJd {
color: @subtext0;
}
a.oBa0Fe {
color: @subtext0;
}
.o6juZc {
background-color: @surface0;
}
.o6juZc:hover {
background-color: @surface0;
box-shadow: 0 4px 12px @crust;
}
.W6pGoe {
background: @surface0;
box-shadow: 0 4px 6px 0 @crust;
}
.WdWr7c {
border-top-color: @surface2;
}
.sU3bKf {
color: @text;
}
.O5OUld {
color: @subtext0;
}
.zP7KFe {
background: @surface1;
}
.O5OUld:hover {
color: @blue;
}
.og3lId {
color: @text;
}
.M3w8Nb .o6juZc {
box-shadow: 0 1px 6px 0 @crust;
}
.r8xEL {
color: @text;
}
.ZZ7G7b {
color: @text;
border-color: @surface1;
}
.NZmxZe {
background-color: @base;
border-color: @surface1;
color: @text;
}
.NZmxZe:not(.rQEFy):hover,
.cj2HCb.iuN0sf .w6PoOe:hover,
.CgGjZc:hover {
background-color: @surface0;
border-color: @surface1;
color: @text;
}
.ssfWCe .ZXJQ7c,
.cj2HCb.iuN0sf .w6PoOe,
.G2XB8d,
.cj2HCb.iuN0sf .w6PoOe .KA8Jyb {
color: @subtext0;
.KA8Jyb:hover {
fill: @subtext1;
}
}
.KA8Jyb {
fill: @subtext0;
}
.CgGjZc:hover .G2XB8d {
color: @subtext1;
}
.o6OF0 {
background-color: @surface1;
&:hover {
background-color: @surface2;
}
.SHFPkb {
color: @text;
}
.PnfqLc {
color: @subtext0;
}
}
.zbRPDe,
.scU1d {
color: @text;
}
.UafVBb {
background-color: @base;
border-color: @surface2;
}
.mEQved {
color: @subtext0;
}
.goxjub {
> path:nth-child(1) {
fill: @blue;
}
> path:nth-child(2) {
fill: @green;
}
> path:nth-child(3) {
fill: @yellow;
}
> path:nth-child(4) {
fill: @red;
}
}
[fill="#34a853"] {
fill: @green;
}
[fill="#4285f4"] {
fill: @blue;
}
[fill="#ea4335"] {
fill: @red;
}
[fill="#fbbc05"] {
fill: @yellow;
}
.ssfWCe .ZXJQ7c:hover {
background-color: @surface0;
color: @text;
}
.qcTKEe {
background-color: @base;
}
.ooPrBf {
background: @base;
}
.r9PaP {
color: @subtext0;
}
.r9PaP:hover {
color: @blue;
}
.H1KrKd {
fill: @subtext0;
}
.cEPPT {
border-bottom-color: @surface1;
}
.Ix6LGe {
background: @base;
box-shadow: 0 2px 10px 0 @crust;
}
.Hm7Qac:hover,
.EuKAde {
background-color: @surface0;
}
.igM9Le {
color: @text;
}
.irf0hb {
box-shadow: 1px 1px 15px 0 @crust;
}
.gb_Mc .gb_Vd button:hover svg,
.gb_Mc .gb_d:hover {
background-color: @surface0;
}
.gb_Mc svg,
.gb_Rc.gb_Vc svg,
.gb_Mc .gb_dd .gb_ld,
.gb_Mc .gb_dd .gb_Lc,
.gb_Mc .gb_dd .gb_fd,
.gb_Rc.gb_Vc .gb_ld {
color: @text;
}
.cEW58 {
background-color: @surface0;
}
.dyAbMb {
fill: @subtext0;
}
.zItAnd,
.zItAnd:link,
.zItAnd:visited,
.zItAnd:hover,
.zItAnd:active {
color: @text;
}
.zItAnd {
background-color: @base;
border-color: @surface1;
}
.zItAnd:not(.MgQdud):hover {
background-color: @surface0;
border-color: @surface1;
}
.fKmH1e {
background-color: @base;
border-color: @surface1;
color: @subtext0;
}
.fKmH1e:hover {
background-color: @surface0;
border-color: @surface1;
}
.nfSF8e,
.WRhYSc {
color: @subtext0;
}
.nfSF8e:hover,
.WRhYSc:hover {
background-color: @surface0;
color: @subtext0;
}
.ssJ7i {
color: @text;
}
.iAIpCb {
color: @subtext0;
}
.KMdzJ,
.ss6qqb .oBrLN,
.ylgVCe {
color: @subtext1;
}
.PmPt7d {
color: @subtext0;
}
.gb_Mc a.gb_E,
.gb_Mc span.gb_E {
color: @text;
}
a.gb_E,
span.gb_E {
color: @text !important;
}
.RzdJxc {
border-top-color: @surface2;
}
.rKnmn {
border-top-color: @surface2;
}
.FzCfme {
color: @subtext0;
}
.hMJ0yc {
color: @subtext0;
}
.yg51vc {
background-color: @base;
}
.hdtb-mitem a {
color: @subtext0;
}
.hdtb-mitem .GOE98c,
.hdtb-mitem a,
.hdtb-mitem.hdtb-msel,
.t2vtad {
color: @subtext0;
}
.t2vtad:not(.hdtb-tl-sel) {
color: @subtext0;
}
.dG2XIf .xpdopen .mJ2Mod {
border-color: @surface1;
}
.t2vtad:not(.hdtb-tl-sel):hover {
background-color: @surface0;
border-color: @surface1;
color: @text;
box-shadow: 0 1px 1px @crust;
}
.hdtb-mitem:hover .GOE98c:hover,
.hdtb-mitem:hover a,
.hdtb-mitem.hdtb-msel,
.t2vtad:hover {
color: @blue;
}
.w6PoOe {
color: @subtext0;
}
.w6PoOe:hover {
color: @text;
}
.Lj9fsd.DU1Mzb {
background-color: @base;
box-shadow: 0 1px 6px 0 @crust;
.o6juZc {
border-color: @surface1 !important;
}
}
.dZ5aUe .vbLSne .MjJqGe:not(.xvfzbc):hover {
background-color: @surface0;
}
.FjVBEd {
color: @green;
}
title-with-lhs-icon:hover .ekf0x h3 {
color: @blue;
}
.GmE3X {
color: @text;
}
.iv236 {
color: @text;
}
.GLcBOb {
border-bottom-color: @surface1;
}
.ss6qqb .Ui2TZ {
color: @text;
}
.wx62f {
color: @subtext0;
}
#rhs .u7yw9 {
border-left-color: @surface1;
}
.ss6qqb .Jk5Tjc {
border-color: @surface2;
}
#rhs .u7yw9 .cLjAic {
border-bottom-color: @surface1;
}
.JNkvid .HnYYW {
color: @text;
}
.aokhrd .TZahnb {
border-left-color: @surface1;
}
.Cx1ZMc {
color: @subtext0;
}
.CBPSbf {
background-color: @base;
}
.E74aCb {
color: @text;
}
.OE86Gc {
background-color: @base;
color: @text;
fill: @text;
}
.c72nic {
color: @text;
}
.GXMTjb {
background-color: @base;
border-color: @surface0;
}
.A9y7kf {
color: @subtext0;
}
.OE86Gc a {
color: @blue;
}
.Es2Et {
color: @subtext0;
}
.KwJT0.VqKh3b div div {
background-color: @base;
fill: @text;
color: @text;
border-color: @surface1;
}
.rx7XFb {
background-color: @surface0;
}
.VP31Vb {
color: @text;
}
.HXQjqf {
background-color: fade(@blue, 25%);
color: @blue;
}
.SW5pqf {
color: @blue;
}
.rQEFy:hover {
color: @blue;
}
.hdtb-tl-sel {
border-color: @surface2;
background: @surface0;
color: @text;
}
.hdtb-tl-sel:focus {
border-color: @surface2;
background: @surface0;
color: @blue;
}
.t2vtad:active,
.t2vtad:not(.hdtb-tl-sel):hover:active {
background-color: @surface0 !important;
box-shadow: inset 0 1px 2px @crust !important;
}
.gTl8xb {
border-color: @subtext0 transparent;
}
.hdtb-mn-hd:hover .gTl8xb {
border-color: @text transparent;
}
.h3L8Ub .yMAEcf {
background: @surface0;
border-color: @surface2;
}
.ynRric {
color: @subtext0;
}
.cRV9hb .pcTkSc .wM6W7d {
color: @text;
}
.h3L8Ub .yMAEcf.sbhl {
background-color: @surface1;
}
.sbhl {
background: @surface1;
}
.CjiZvb,
.GZnQqe.EpPYLd:active {
background-color: @surface0;
}
.PyJv1b {
color: @text;
}
.REySof {
color: @overlay2 !important;
}
.NQyKp {
color: @surface0 !important;
background: @accent !important;
}
.b0Xfjd {
color: @base !important;
}
.LiOdre {
background-color: @base;
border-color: @surface1;
}
.LiOdre:hover {
background-color: @mantle;
border-color: @surface2;
}
.LiOdre:focus {
border-color: @blue;
}
.mfsgsd {
color: @text;
}
.GCSyeb {
background: @surface1;
}
.IVvPP .cLjAic.WY0eLb,
.Hwkikb.WY0eLb {
border-left-color: @surface1;
}
.mQo3nc {
background-color: @surface0;
color: @subtext0 !important;
}
.cfBJGe {
color: @text;
}
.f6F9Be {
background: @mantle;
}
.KwU3F {
color: @blue;
}
.b0KoTc {
color: @text;
}
.dfB0uf {
color: @text;
}
.unknown_loc {
background: @text;
}
.GS5rRd {
color: @blue;
}
.xSQxL {
color: @blue;
}
.smiUbb {
color: @text;
}
.b2hzT {
border-bottom-color: @surface0;
}
#swml {
border-left-color: @surface0;
}
.KXbwLb {
background-color: @surface2;
}
.WZH4jc .VknLRd .GNJvt {
background: @surface0;
}
.WZH4jc .VknLRd:hover .GNJvt {
background: @surface1;
}
.GNJvt {
color: @text;
}
.fJOpI.H9lube {
background-color: @blue !important;
border-color: @blue;
}
.XNo5Ab.XNo5Ab {
color: @base !important;
fill: @base !important;
}
.Ss2Faf.boljiHqtXe7__place-qa-title {
color: @text !important;
}
.xEzgBc {
color: @text !important;
}
.Ss2Faf.sq4Bpf {
color: @text !important;
}
.ea0Lbe {
background: @surface0;
}
.f6GA0,
.CacfB,
.Ua7Yuf {
background: @base;
}
.DV7the {
color: @blue;
}
.ZeVBtc {
color: @subtext0;
}
.cB9M7 {
background-color: @surface0;
border-color: @surface1;
color: @text;
&:hover {
border-color: @surface2;
}
&:focus {
border-color: @blue;
}
}
.Qwbd3 {
background: @surface0;
color: @text;
border-color: @surface1;
&:hover {
background: @surface1;
border-color: @surface2;
}
}
.ArIAXb {
fill: @surface0;
}
.qOFLsb {
fill: @surface0;
}
.aHK1bd {
color: @subtext0;
}
.diOlIe {
border-top-color: @overlay0;
}
.p4pvTd {
color: @text;
}
.gIYJUc {
background: @base !important;
border-color: @surface1 !important;
}
.Gdd5U > g:nth-child(2) {
> circle:nth-child(1) {
fill: @green !important;
}
> circle:nth-child(2) {
fill: @blue !important;
}
> path:nth-child(3) {
fill: @red !important;
}
> path:nth-child(4) {
fill: @yellow !important;
}
> path:nth-child(5) {
fill: @blue !important;
}
}
.CbAZb {
background: @base;
border-bottom-color: @surface0;
}
.S8wJ3 {
color: @text !important;
}
.ZI7elf {
color: @text !important;
}
.tGS0Nc {
color: @text;
}
.kzt0Nc a {
color: @subtext0 !important;
}
.fgc1P,
.N7KPxb {
border-top-color: @surface0 !important;
}
.kQEH5b {
color: @subtext0 !important;
}
.kNKdL {
color: @text !important;
}
.q0yked:hover {
background-color: @mantle !important;
}
.Oz5Rbb:hover {
background: @mantle !important;
}
.lwwARb {
background-color: @crust !important;
}
.LO47Ff {
color: @text;
}
.j8PBfc {
color: @subtext0;
}
.act-tim-txt-cnt {
color: @text;
}
.act-switch-area {
background-color: @base !important;
}
.EwDHG,
.vNdLpe,
.vNdLpe:visited {
color: @subtext0 !important;
}
// "Looking for results in English?" popup
[style*="background:#1f1000;border:1px solid #502900"],
[style*="background:#feefc3;border:1px solid #fdd663"] {
background: @mantle !important;
border-color: @surface0 !important;
box-shadow: 0 2px 4px @mantle !important;
[style*="color:#bdc1c6"],
[style*="color:#202124"] {
color: @text !important;
}
}
// translate this page label
.eFM0qc.BCF2pd {
background: @base !important;
}
// expand related question icon
.aj35ze {
@svg: escape(
''
);
background-image: url("data:image/svg+xml,@{svg}");
}
// tabs
[selected].YmvwI {
color: @text;
border-bottom-color: @text;
}
.YmvwI {
color: @subtext0;
}
// search bar buttons popups
[style^="background: rgb(32, 33, 36); border: 1px solid rgb(60, 64, 67);"] {
background: @mantle !important;
border-color: @overlay0 !important;
box-shadow: @mantle 1px 2px 4px !important;
color: @text !important;
[style^="border-style: solid;"] {
border-color: @overlay0 transparent !important;
}
}
// google apps button
.gb_F .gb_E,
.gb_F .gb_D {
fill: @text;
}
// translate popup
.t4wgMc {
background: @mantle;
}
.ELfqBe:hover,
.ELfqBe:focus {
background: @surface0;
}
.JFeuTc {
color: @text;
}
// skip to content
.S6VXfe {
background: @base;
}
// selected image
.qyKxnc.FnEtTd .srrRv {
background: fade(@blue, 10%);
}
// images page sticky suggestions header
.JiJthb,
.JiJthb .GKS7s:not([selected]) {
background: @mantle;
}
.JiJthb .F9Idpe.vezEod {
background: linear-gradient(
to left,
transparent 0%,
@mantle 60%,
@mantle
);
}
/// tv show information
// episode title
.huUgrf {
color: @blue;
}
// episode divider
.PZPZlf, .Ea7JLb {
border-color: @surface2;
}
/// season selection
// underline
.A0zxBb {
color: @text;
}
// background and border
.qFF17c {
background-color: @surface0 !important;
border-color: @surface2 !important;
}
// middle divider
.qFF17c > div {
border-color: @surface2 !important;
}
// text
.F3Istb > span {
color: @subtext1 !important;
}
// text underline
.F9SH7d {
border-color: @text !important;
}
/// watch buttons
// button
.ZkkK1e {
background-color: @surface0;
border-color: @surface1;
}
// text
.HJFlGc {
color: @text;
}
// play button
.GzErzd {
color: @blue !important;
}
// footer logo
[style^="background:url(/images/nav_logo321.webp)"] {
@svg: escape(
''
);
background-image: url("data:image/svg+xml,@{svg}") !important;
}
// tweets horizontal list
g-right-button,
g-left-button {
> g-fab {
background: @crust !important;
border-color: @surface0;
}
}
.vwfsqc {
.QuU3Wb {
color: @text;
}
}
// image overlays
.yUzGqc.wr8GYd {
background: fade(@crust, 75%);
color: @text;
}
// google lens icon hover
.ig2Tkd:hover:not(.RDPZE) {
background: fade(@mantle, 80%);
}
// image resolution
.UWuvyf {
background-color: fade(@crust, 80%);
color: @text;
}
// image hover shadow
.mkpRId.qyKxnc:hover .F0uyec {
background: fade(@crust, 5%);
box-shadow: 0 2px 12px 0 @crust;
}
// advanced search
input.jfk-textinput,
.gGbPid {
background: @base;
color: @text;
border-color: @overlay0;
}
.goog-menu {
background: @mantle;
}
.goog-menuitem-highlight,
.goog-menuitem-hover {
background: @surface0;
border-color: @surface0;
}
.goog-menuitem,
.goog-menuitem-highlight .goog-menuitem-content,
.goog-menuitem-hover .goog-menuitem-content {
color: @text;
}
.goog-flat-menu-button-hover {
border-color: @overlay2;
.goog-flat-menu-button-dropdown {
border-color: @overlay2 transparent;
}
}
.goog-flat-menu-button-dropdown {
border-color: @overlay0 transparent;
}
div.otByu div.FAcADc,
div.lFApYd,
.jfk-radiobutton-label {
color: @subtext1;
}
// knowledge panel
.Qc895c,
.Utq4Cb.PZPZlf,
.SU02Qd g-inner-card {
background-color: @surface0 !important;
}
.Qc895c div,
.Utq4Cb.PZPZlf div,
.CYJS5e {
color: @text !important;
}
.CYJS5e.W0urI,
.REySof.T9jMmf,
.b0Xfjd.Hyaw8c,
.dvfTSb.OdANFd {
background-color: @surface0 !important;
color: @text !important;
}
.CYJS5e.W0urI:hover {
background-color: @surface1 !important;
}
.gEYEQc.x5W9xd.qYvl9c.klitem,
.MJfuMd {
background-color: @base !important;
border-color: @surface1 !important;
}
.NQyKp.Hyaw8c.h4wEae.Maj6Tc {
border-color: @text !important;
}
color: @subtext0;
}
@media (prefers-color-scheme: light) {
body {
#catppuccin(@lightFlavor);
}
}
@media (prefers-color-scheme: dark) {
body {
#catppuccin(@darkFlavor);
}
}
}
@-moz-document regexp("^https?://(ogs\\.)?google\\..*") {
body {
@media (prefers-color-scheme: light) {
#catppuccin(@lightFlavor);
}
@media (prefers-color-scheme: dark) {
#catppuccin(@darkFlavor);
}
}
#catppuccin(@flavor) {
@rosewater: @catppuccin[@@flavor][@rosewater];
@flamingo: @catppuccin[@@flavor][@flamingo];
@pink: @catppuccin[@@flavor][@pink];
@mauve: @catppuccin[@@flavor][@mauve];
@red: @catppuccin[@@flavor][@red];
@maroon: @catppuccin[@@flavor][@maroon];
@peach: @catppuccin[@@flavor][@peach];
@yellow: @catppuccin[@@flavor][@yellow];
@green: @catppuccin[@@flavor][@green];
@teal: @catppuccin[@@flavor][@teal];
@sky: @catppuccin[@@flavor][@sky];
@sapphire: @catppuccin[@@flavor][@sapphire];
@blue: @catppuccin[@@flavor][@blue];
@lavender: @catppuccin[@@flavor][@lavender];
@text: @catppuccin[@@flavor][@text];
@subtext1: @catppuccin[@@flavor][@subtext1];
@subtext0: @catppuccin[@@flavor][@subtext0];
@overlay2: @catppuccin[@@flavor][@overlay2];
@overlay1: @catppuccin[@@flavor][@overlay1];
@overlay0: @catppuccin[@@flavor][@overlay0];
@surface2: @catppuccin[@@flavor][@surface2];
@surface1: @catppuccin[@@flavor][@surface1];
@surface0: @catppuccin[@@flavor][@surface0];
@base: @catppuccin[@@flavor][@base];
@mantle: @catppuccin[@@flavor][@mantle];
@crust: @catppuccin[@@flavor][@crust];
@accent: @catppuccin[@@flavor][@@accentColor];
.aRDKUe {
.rRF0wd {
fill: @yellow !important;
}
.ub0gT {
fill: @base !important;
}
.Pzuhxc {
color: @text !important;
&:hover {
background-color: @surface2 !important;
}
}
.hCDve {
color: @text !important;
}
.WkuXae {
color: @blue;
}
.coHE2 {
border-color: @surface2 !important;
&:hover {
background-color: fade(@blue, 25%);
}
}
.eYSAde {
color: @text !important;
}
.Lvwayc {
background-color: @surface0 !important;
}
.Z6NXed {
color: @text !important;
}
.bMnvr {
background: @surface1 !important;
}
.Wdz6e {
color: @subtext0 !important;
}
.LzIwWe {
color: @text !important;
}
.znj3je {
color: @text !important;
}
.fVFoBd {
color: @text !important;
}
.cllK4d {
background: @surface0 !important;
color: @subtext0 !important;
}
.aFCkf {
background: @surface0 !important;
color: @blue !important;
}
.DgDbFe .vZvJBb:not(:first-child) .BVnP4c::before {
color: @text !important;
}
.qLP7kc .jFfZdd {
background: @base !important;
}
.Z6NXed:hover {
background-color: @surface1 !important;
}
}
.nz9sqb.EHzcec {
background: var(--gm3-sys-color-surface-container-high, @surface0);
.LVal7b {
background: var(--gm3-sys-color-surface-container-low, @mantle);
}
}
.nz9sqb {
.NQV3m {
color: var(--gm3-sys-color-primary, @blue);
border-color: var(--gm3-sys-color-outline, @surface2);
&:hover {
background-color: fade(@blue, 25%);
}
&:focus {
background-color: fade(@blue, 25%);
}
}
.Rq5Gcb {
color: @text !important;
}
.tX9u1b:hover {
background-color: @surface0;
}
}
.nz9sqb.o07G5 .tX9u1b:active,
.nz9sqb.o07G5 .tX9u1b:active:focus,
.nz9sqb.o07G5 .tX9u1b:active .Rq5Gcb,
.nz9sqb.o07G5 .tX9u1b:active:hover .Rq5Gcb {
background-color: @surface0;
}
.aRDKUe .pRjiJb,
.aRDKUe .DmSTqc {
color: @text;
}
.aRDKUe .idKC9b,
.aRDKUe .MbHqJ {
color: @subtext0;
}
.aRDKUe .GXg3Le {
color: @blue;
}
.aRDKUe .G5bXNb {
background-color: @mantle;
&:hover {
background-color: @base;
}
}
}
}
#rgbify(@color) {
@rgb: red(@color), green(@color), blue(@color);
}
/* deno-fmt-ignore */
@catppuccin: {
@latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };
@frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };
@macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };
@mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #f4f4f4; @subtext1: #e0e0e0; @subtext0: #c6c6c6; @overlay2: #a8a8a8; @overlay1: #8d8d8d; @overlay0: #6f6f6f; @surface2: #525252; @surface1: #393939; @surface0: #262626; @base: #161616; @mantle: #0b0b0b; @crust: #000000; };
};