FVUI

By FeoreV Version 2.0.0 Updated 04/05/2024 73.3K downloads

Blur is the New Black

transparent customizable dark light animated

Live preview

Full Discord interface with this theme applied — powered by ThemePreview.

Screenshot

FVUI.theme.css

GitHub

Open source

https://raw.githubusercontent.com/FeoreV/Themes/58988c87e4ea10b078cac6b768f8d657910b2357/Discord/Release/FVUI.theme.css

1/**

2* @name FVUI

3* @author feorev

4* @description Blur is the New Black

5* @version 2.0.0

6* @authorId 489785940546551831

7* @invite baEMQkgswT

8* @source https://github.com/FeoreV/Themes/tree/main/Discord/FVUI

9*/

10/* ! DO NOT TOUCH ! */

11@import url(https://feorev.github.io/Themes/Discord/FVUI/Cores/preload.css);

12@import url(https://feorev.github.io/Themes/Discord/FVUI/assets/Versions/v2.css);

14/*=============================================

15= Info =

16==============================================*

17 DiscordServer: https://discord.com/invite/baEMQkgswT

18 DM - feorev

19 Site - https://feorev.github.io/

20 ThemeEditor - https://bdeditor.dev/theme/FVUI

	Due to the inability to update the theme file frequently, many new additions to the theme will be posted on the discord server.

	The FVUI theme extends not only to discord, but also to other sites and areas. You can find a complete list of themes on the discord server.

27/*=============================================

28= FAQ =

29==============================================*

31/*---------- How to enable another subtheme? ----------*

33 IT IS RECOMMENDED TO USE AN EDITOR ( https://bdeditor.dev/theme/FVUI )

35 Select import and press ctrl+/

37 Enabled - @import url(...)

38 Disabled - /*@import url(...)*/

41/*---------- I want ... ----------

42 Make the background a picture - enable WIN11

43 Make discord transparent - enable Mica

44 Change background picture - Change the settings of the win11 subtheme - the --dark/light BG variable

46/*---------- Any other questions? ----------

47 Join the discord server c:

48 https://discord.com/invite/baEMQkgswT

52/*=============================================

53= Subthemes to choose =

54=============================================*/

56/*---------- Default ----------*/

57 /* Default */

58@import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/Default.css);

59 /* Lite */

60/* @import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/Default_lite.css); */

62/*---------- CustomBackground ----------*/

63 /* WIN11 */

64/* @import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/CustomBackground.css); */

65 /* Lite11 */

66/* @import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/CustomBackground_lite.css); */

68/*---------- Other ----------*/

	/*MICA (Required "Mica For Everyone" and enabling transparency (Settings=>BD=>Settings=>Window preferences=>Enable transparency)*/

70/* @import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/Mica.css); */

74/*=============================================

75= Addons =

76=============================================*/

	/* Events (Any events and decorations for the holidays. For example, snow and New Year's attributes for the new year.) */

79@import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/Events/Events.css);

81 /* ServerRings */

82@import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/ServerRings.css);

84 /* RadialStatus */

85@import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/RadialStatus.css);

87 /* MaterialYou (The theme color scheme adjusts to the accent color) */

88/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/MaterialYou.css); */

90 /* ModularDesign (Adds outline to main sections) */

91/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/ModularDesign.css); */

93 /* TopUserPanel (Moves the userpanel to the top corner) */

94/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/TopUserPanel.css); */

	/* HorizontalServerList (Moves serverlist to the top or bottom corner. For FVUI, it is recommended to use this version of HSL, and not the official one.) */

97/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/HSL/HSL_top.css); */

98/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/HSL/HSL_bottom.css); */

100 /* TitleIsland */

101/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/TitleIsland.css); */

102

103

104

105/*=============================================

106= SubThemes Settings =

107=============================================*/

108

109 /* Theme editor - https://bdeditor.dev/theme/FVUI */

110

111 /*---------- General ----------*/

112:root{

113

	--cursor  : url('https://feorev.github.io/Themes/Discord/FVUI/assets/Cursor.cur');         /* Link to cursor / unset - to set standard */

114

	--font    : ";Comfortaa";;                                                                   /* The font must be pre-installed or imported */

115 --homeicon: url("https://feorev.github.io/Themes/Discord/FVUI/assets/HomeIcon/Icon.png"); /* Link to image */

116}

117

118:root{

119 --ColorOpacity : 1; /* Opacity multiplier / Default=1 (0.1-...) */

120 --DisableOpacity: 0; /* Disable Opacity / Default=0 (0 or 1) */

121}

122

123:root.theme-dark {

124 --color1: 30, 40, 50; /* Additional BG / Default= | 30, 40, 50 | (any raw rgb value) */

125 --color2: 9, 18, 24; /* Background / Default= | 9, 18, 24 | (any raw rgb value) */

126 --color3: 35, 120, 200; /* Additional Color / Default= | 35, 120, 200 | (any raw rgb value) */

127 --color4: 63, 43, 150; /* Gradient Color / Default= | 63, 43, 150 | (any raw rgb value) */

128}

129:root.theme-light {

130 --color1: 211, 204, 227; /* Additional BG / Default= | 211, 204, 227 | (any raw rgb value) */

131 --color2: 219, 219, 219; /* Background / Default= | 219, 219, 219 | (any raw rgb value) */

132 --color3: 96, 205, 255; /* Additional Color / Default= | 96,205,255 | (any raw rgb value) */

133 --color4: 63, 43, 150; /* Gradient Color / Default= | 63, 43, 150 | (any raw rgb value) */

134}

135

136 /*---------- CustomBackground ----------*/

137:root{

138

	--DarkBG   : url(https://feorev.github.io/Themes/Discord/FVUI/assets/Wallpapers/dark.avif);   /* Link to background image / Default= url(https://feorev.github.io/Themes/Discord/assets/Wallpapers/dark.avif) ( url(link) ) */

139

	--LightBG  : url(https://feorev.github.io/Themes/Discord/FVUI/assets/Wallpapers/light.avif);  /* Link to background image / Default= url(https://feorev.github.io/Themes/Discord/assets/Wallpapers/light.avif) ( url(link) ) */

140

	--OpacityBG: 60%;                                                                             /* Background image transparency / Default=100% (0%-100%) */

141

	--BlurBG   : 0px;                                                                             /* Background image blur / Default=0px (any value in px) */

142}

143

144

145 /*---------- Mica ----------*/

146:root{

147 --BGopacity: 30%; /* Background image transparency / Default=30% (0%-100%) */

148 --BGcolor : var(--color2); /* Сolor in RGB / Example = rgb(255,255,255) ( any value in RGB (like example) ) */

149}

150

151

152

153/*=============================================

154= Addons Settings =

155=============================================*/

156

157 /*---------- MaterialYou ----------*/

158:root.theme-dark{ /* First 2 HSL values / Default= | 210, 68% | https://g.co/kgs/83i83K */

159 --accentcolor-HUE: 210;

160 --accentcolor-SATURATION: 68%;

161}

162:root.theme-light{ /* First 2 HSL values / Default= | 199, 100% | https://g.co/kgs/83i83K */

163 --accentcolor-HUE: 199;

164 --accentcolor-SATURATION: 100%;

165}

166

167 /*---------- ModularDesign ----------*/

168:root{ /*MainModules*/

169 --outline : 3px; /* outline size / Default=3px (any value in px) */

170

	--outlineCLR : var(--color03);          /* outline color / Example = rgb(255,255,255) ( any value in RGB (like example) ) */

171 --outlineBR : 16px; /* outline rounding / Default=16px (any value in px) */

172 --outlineMG : 2rem; /* outline margin / Default=2rem (any value in px/rem/...) */

173 --outlineBS : 15px; /* outline glow / Default = 15px */

174

	--outlineBG  : unset;                   /* outline content background color / Example = rgb(255,255,255) ( any value in RGB (like example) */

175 --outlineBLUR: 0; /* (ONLY WIN11) backdrop blur / Default=0 ( any value in px */

176}

177

178:root{ /*AdditionalModules*/

179 --outline2 : 0; /* outline size / Default=0px (disabled) (any value in px) */

180

	--outlineCLR2 : var(--outlineCLR);  /* outline color / Example = rgb(255,255,255) ( any value in RGB (like example) ) */

181 --outlineBR2 : var(--outlineBR); /* outline rounding / (any value in px) */

182 --outlineMG2 : var(--outlineMG); /* outline margin / (any value in px/rem/...) */

183 --outlineBS2 : 0; /* outline glow / Default = 0 */

184

	--outlineBG2  : unset;              /* outline content background color / Example = rgb(255,255,255) ( any value in RGB (like example) */

185

	--outlineBLUR2: 0                   /* (ONLY WIN11) (Not recommended - bad performance) backdrop blur / Default=0 ( any value in px ) */

186}

187

188 /*---------- Have you tuned the theme well? ----------*/

189

/* You can share your vision of the world in the channel of the Discord server by sending the settings: https://discord.gg/baEMQkgswT */

190

191/*=============================================

192= Credits =

193= gibbu - RadialStatus / ServerRings =

194=============================================*/

195

/**
* @name FVUI
* @author feorev
* @description Blur is the New Black
* @version 2.0.0
* @authorId 489785940546551831
* @invite baEMQkgswT
* @source https://github.com/FeoreV/Themes/tree/main/Discord/FVUI
*/
/* ! DO NOT TOUCH ! */
@import url(https://feorev.github.io/Themes/Discord/FVUI/Cores/preload.css);
@import url(https://feorev.github.io/Themes/Discord/FVUI/assets/Versions/v2.css);

/*=============================================
=                     Info                    =
==============================================*
	DiscordServer: https://discord.com/invite/baEMQkgswT
	DM - feorev
	Site - https://feorev.github.io/
	ThemeEditor - https://bdeditor.dev/theme/FVUI

	Due to the inability to update the theme file frequently, many new additions to the theme will be posted on the discord server.
	The FVUI theme extends not only to discord, but also to other sites and areas. You can find a complete list of themes on the discord server.



/*=============================================
=                    FAQ                      =
==============================================*

/*----------  How to enable another subtheme?  ----------*
	
	IT IS RECOMMENDED TO USE AN EDITOR ( https://bdeditor.dev/theme/FVUI )

	Select import and press ctrl+/

	Enabled - @import url(...)
	Disabled - /*@import url(...)*/

	
/*----------  I want ...  ----------
	Make the background a picture - enable WIN11
	Make discord transparent - enable Mica
	Change background picture - Change the settings of the win11 subtheme - the --dark/light BG variable

/*----------  Any other questions?  ----------
	Join the discord server c:
	https://discord.com/invite/baEMQkgswT


	
/*=============================================
=             Subthemes to choose             =
=============================================*/

/*----------  Default  ----------*/
	/* Default */
@import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/Default.css);
	/* Lite */
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/Default_lite.css); */

/*----------  CustomBackground  ----------*/
	/* WIN11 */ 
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/CustomBackground.css); */
	/* Lite11 */
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/CustomBackground_lite.css); */

/*----------  Other  ----------*/
	/*MICA (Required "Mica For Everyone" and enabling transparency (Settings=>BD=>Settings=>Window preferences=>Enable transparency)*/
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/assets/SubThemes/Mica.css); */



/*=============================================
=                   Addons                   =
=============================================*/

	/* Events (Any events and decorations for the holidays. For example, snow and New Year's attributes for the new year.) */
@import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/Events/Events.css);

	/* ServerRings */
@import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/ServerRings.css); 

	/* RadialStatus */
@import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/RadialStatus.css);

	/* MaterialYou (The theme color scheme adjusts to the accent color) */
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/MaterialYou.css); */

	/* ModularDesign (Adds outline to main sections) */
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/ModularDesign.css); */

	/* TopUserPanel (Moves the userpanel to the top corner) */
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/TopUserPanel.css); */

	/* HorizontalServerList (Moves serverlist to the top or bottom corner. For FVUI, it is recommended to use this version of HSL, and not the official one.) */
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/HSL/HSL_top.css); */
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/HSL/HSL_bottom.css); */

	/* TitleIsland */
/* @import url(https://feorev.github.io/Themes/Discord/FVUI/Addons/TitleIsland.css); */



/*=============================================
=             SubThemes Settings              =
=============================================*/

	/* Theme editor - https://bdeditor.dev/theme/FVUI */

	/*----------  General  ----------*/
:root{
	--cursor  : url('https://feorev.github.io/Themes/Discord/FVUI/assets/Cursor.cur');         /* Link to cursor / unset - to set standard */
	--font    : "Comfortaa";                                                                   /* The font must be pre-installed or imported */
	--homeicon: url("https://feorev.github.io/Themes/Discord/FVUI/assets/HomeIcon/Icon.png");  /* Link to image */
}

:root{
    --ColorOpacity  : 1;  /* Opacity multiplier / Default=1 (0.1-...) */
    --DisableOpacity: 0;  /* Disable Opacity / Default=0 (0 or 1) */
}

:root.theme-dark {
	--color1: 30, 40,  50;   /* Additional BG / Default= | 30, 40, 50 | (any raw rgb value) */
	--color2: 9,  18,  24;   /* Background / Default= | 9, 18, 24 | (any raw rgb value) */
	--color3: 35, 120, 200;  /* Additional Color / Default= | 35, 120, 200 | (any raw rgb value) */
	--color4: 63, 43,  150;  /* Gradient Color / Default= | 63, 43, 150 | (any raw rgb value) */
}
:root.theme-light {
	--color1: 211, 204, 227;  /* Additional BG / Default= | 211, 204, 227 | (any raw rgb value) */
	--color2: 219, 219, 219;  /* Background / Default= | 219, 219, 219 | (any raw rgb value) */
	--color3: 96,  205, 255;  /* Additional Color / Default= | 96,205,255 | (any raw rgb value) */
	--color4: 63,  43,  150;  /* Gradient Color / Default= | 63, 43, 150 | (any raw rgb value)  */
}

	/*----------  CustomBackground  ----------*/
:root{
	--DarkBG   : url(https://feorev.github.io/Themes/Discord/FVUI/assets/Wallpapers/dark.avif);   /* Link to background image / Default= url(https://feorev.github.io/Themes/Discord/assets/Wallpapers/dark.avif) ( url(link) ) */
	--LightBG  : url(https://feorev.github.io/Themes/Discord/FVUI/assets/Wallpapers/light.avif);  /* Link to background image / Default= url(https://feorev.github.io/Themes/Discord/assets/Wallpapers/light.avif) ( url(link) ) */
	--OpacityBG: 60%;                                                                             /* Background image transparency / Default=100% (0%-100%) */
	--BlurBG   : 0px;                                                                             /* Background image blur / Default=0px (any value in px) */
}


	/*----------  Mica  ----------*/
:root{
	--BGopacity: 30%;            /* Background image transparency / Default=30% (0%-100%) */
	--BGcolor  : var(--color2);  /* Сolor in RGB / Example = rgb(255,255,255) ( any value in RGB (like example) ) */
}



/*=============================================
=               Addons Settings               =
=============================================*/

	/*----------  MaterialYou  ----------*/
:root.theme-dark{ /* First 2 HSL values / Default= | 210, 68% | https://g.co/kgs/83i83K */
	--accentcolor-HUE: 210;
	--accentcolor-SATURATION: 68%;
}
:root.theme-light{ /* First 2 HSL values / Default= | 199, 100% | https://g.co/kgs/83i83K */
	--accentcolor-HUE: 199;
	--accentcolor-SATURATION: 100%;
}

	/*----------  ModularDesign  ----------*/
:root{ /*MainModules*/
	--outline    : 3px;                     /* outline size / Default=3px (any value in px) */
	--outlineCLR : var(--color03);          /* outline color / Example = rgb(255,255,255) ( any value in RGB (like example) ) */
	--outlineBR  : 16px;                    /* outline rounding / Default=16px (any value in px) */
	--outlineMG  : 2rem;                    /* outline margin / Default=2rem (any value in px/rem/...) */
	--outlineBS  : 15px;                    /* outline glow / Default = 15px */
	--outlineBG  : unset;                   /* outline content background color / Example = rgb(255,255,255) ( any value in RGB (like example) */
	--outlineBLUR: 0;                       /* (ONLY WIN11) backdrop blur / Default=0 ( any value in px */
}

:root{ /*AdditionalModules*/
	--outline2    : 0;                  /* outline size / Default=0px (disabled) (any value in px) */
	--outlineCLR2 : var(--outlineCLR);  /* outline color / Example = rgb(255,255,255) ( any value in RGB (like example) ) */
	--outlineBR2  : var(--outlineBR);   /* outline rounding / (any value in px) */
	--outlineMG2  : var(--outlineMG);   /* outline margin / (any value in px/rem/...) */
	--outlineBS2  : 0;                  /* outline glow / Default = 0 */
	--outlineBG2  : unset;              /* outline content background color / Example = rgb(255,255,255) ( any value in RGB (like example) */
	--outlineBLUR2: 0                   /* (ONLY WIN11) (Not recommended - bad performance) backdrop blur / Default=0 ( any value in px ) */
}

	/*----------  Have you tuned the theme well?   ----------*/
/* You can share your vision of the world in the channel of the Discord server by sending the settings: https://discord.gg/baEMQkgswT */

/*=============================================
=                   Credits                   =
= 	   gibbu - RadialStatus / ServerRings     =
=============================================*/

Actions

Download Source

About

Version: 2.0.0
Downloads: 73,282
Added: 10/15/2023
Updated: 04/05/2024
Hash: 4095afe5-ebc6-48ae-8265-e5ad71053e09
Source: https://github.com/FeoreV/Themes/tree/main/Discord/FVUI

Author

FeoreV GitHub

Live preview

Screenshot

Open source

FiveCord for Windows