RadialStatus

By Gibbu Version 2.0.0 Updated 04/03/2025 476.3K downloads

Changes the status icons to wrap around the avatar. Shape can be changed inside the theme file.

other

374

Live preview

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

Screenshot

RadialStatus.theme.css

GitHub

Open source

https://raw.githubusercontent.com/DiscordStyles/RadialStatus/e361ae760dd8b88f6c187efa11a83e9aea3afd83/RadialStatus.theme.css

1/**

2 * @name RadialStatus

3 * @author Gibbu#1211

4 * @version 2.0.0

5 * @description Changes the status icons to wrap around the avatar. Shape can be changed inside the theme file.

6 * @source https://github.com/DiscordStyles/RadialStatus

7 * @invite ZHthyCw

8*/

10@import url('https://discordstyles.github.io/RadialStatus/RadialStatus.css');

14:root {

15 /*

16 * Spacing

17 */

18 --rs-small-spacing: 2px; /* Gap between avatar and status for members list/dms | MUST end in px */

19 --rs-medium-spacing: 3px; /* Gap between avatar and status for User popout | MUST end in px */

20 --rs-large-spacing: 4px; /* Gap between avatar and status for User profiles | MUST end in px */

21 /*

22 * Widths

23 */

24 --rs-small-width: 2px; /* Thickness of status border for members list/dms | MUST end in px */

25 --rs-medium-width: 3px; /* Thickness of status border for User popout | MUST end in px */

26 --rs-large-width: 4px; /* Thickness of status border for User profile | MUST end in px */

27 /*

28 * Shape

29 */

30 --rs-avatar-shape: 50%; /* 50% for round - 0% for square */

31 /*

32 * Colours

33 */

34 --rs-online-color: #43b581; /* Colour for online status */

35 --rs-idle-color: #faa61a; /* Colour for idle status */

36 --rs-dnd-color: #f04747; /* Colour for dnd status */

37 --rs-offline-color: #636b75; /* Colour for offline status */

38 --rs-streaming-color: #643da7; /* Colour for streaming status */

39 --rs-invisible-color: #747f8d; /* Colour for invisible status - Note: this will only show for your own invisibility */

40 --rs-self-speaking-color: #57d39b; /* Colour for speaking ring in the bottom left while in a voice chat/call */

41 --rs-phone-color: var(--rs-online-color); /* Colour of the ring &; phone icon */

42 /*

43 * Others

44 */

  --rs-phone-visible: block; /* Visibility of the phone icon next to a users avatar. | block = visible | none = hidden */

46}

/**
 * @name RadialStatus
 * @author Gibbu#1211
 * @version 2.0.0
 * @description Changes the status icons to wrap around the avatar. Shape can be changed inside the theme file.
 * @source https://github.com/DiscordStyles/RadialStatus
 * @invite ZHthyCw
*/

@import url('https://discordstyles.github.io/RadialStatus/RadialStatus.css');



:root {
  /*
    * Spacing
    */
  --rs-small-spacing: 2px; /* Gap between avatar and status for members list/dms | MUST end in px */
  --rs-medium-spacing: 3px; /* Gap between avatar and status for User popout | MUST end in px */
  --rs-large-spacing: 4px; /* Gap between avatar and status for User profiles | MUST end in px */
  /*
    * Widths
    */
  --rs-small-width: 2px; /* Thickness of status border for members list/dms | MUST end in px */
  --rs-medium-width: 3px; /* Thickness of status border for User popout | MUST end in px */
  --rs-large-width: 4px; /* Thickness of status border for User profile | MUST end in px */
  /*
    * Shape
    */
  --rs-avatar-shape: 50%; /* 50% for round - 0% for square */
  /*
    * Colours
    */
  --rs-online-color: #43b581; /* Colour for online status */
  --rs-idle-color: #faa61a; /* Colour for idle status */
  --rs-dnd-color: #f04747; /* Colour for dnd status */
  --rs-offline-color: #636b75; /* Colour for offline status */
  --rs-streaming-color: #643da7; /* Colour for streaming status */
  --rs-invisible-color: #747f8d; /* Colour for invisible status - Note: this will only show for your own invisibility */
  --rs-self-speaking-color: #57d39b; /* Colour for speaking ring in the bottom left while in a voice chat/call */
  --rs-phone-color: var(--rs-online-color); /* Colour of the ring & phone icon  */
  /*
    * Others
    */
  --rs-phone-visible: block; /* Visibility of the phone icon next to a users avatar. | block = visible | none = hidden */
}

Actions

Download Source

About

Version: 2.0.0
Downloads: 476,277
Added: 02/23/2021
Updated: 04/03/2025
Hash: 44003557-6a31-c3be-03f6-b4bdf69e3550
Source: https://github.com/DiscordStyles/RadialStatus

Author

Gibbu GitHub

Live preview

Screenshot

Open source

FiveCord for Windows