Permalink
Branch: master
Find file Copy path
548 lines (477 sloc) 45.7 KB
//////////////////////////////////////////////////////////////////////////////////////////////////
// //
// SolidDark theme v1.4 for Telegram Desktop. //
// //
// //
// Source code: https://github.com/MasterGroosha/telegram-soliddark-theme //
// //
// Published under MIT Licence. Feel free to modify this file whatever you want. //
// Mentioning the original repo (see above) isn't mandatory, but highly appreciated! //
// //
// //
//////////////////////////////////////////////////////////////////////////////////////////////////
// Color presets //
COLOR_GRAY: #999999;
COLOR_DARK: #2f2f2f; // Main color (dark one)
COLOR_GREEN_DARK: #008000; // Accent color
COLOR_GREEN_LIGHT: #15cd7d; // Accent color #2 (just like first one with slight changes)
COLOR_GREEN_RIPPLE_ACTIVE: #025618;
COLOR_WHITE: #ffffff;
COLOR_BLACK: #000000;
COLOR_PINK: #e016a0; // Just for testing purposes :)
// basic
windowBg: COLOR_DARK; // Window backgrounds
windowFg: COLOR_WHITE; // Main text / chat text
windowBgOver: #363838; // Search field background + buttons color in context menu
windowBgRipple: #272828; // Inactive chat in chats list (press & hold)
windowFgOver: windowFg; // black: fallback for over text color
windowSubTextFg: COLOR_GRAY; // Chats list message preview text
windowSubTextFgOver: #919191; // Mouse over chats list message preview text
windowBoldFg: COLOR_WHITE; // Bold font (titles in Settings, Left menu options)
windowBoldFgOver: COLOR_GREEN_LIGHT; // Mouse over chats list chat name text (+ Left menu options on hover)
windowBgActive: COLOR_GREEN_DARK; // Active button background (+ checkboxes background)
windowFgActive: COLOR_WHITE; // Active selected chats list text / button text + checkboxes' "ticks" color
windowActiveTextFg: COLOR_GREEN_LIGHT; // Online status, links, recording cancel, etc
windowShadowFg: COLOR_BLACK; // Window border shadows
windowShadowFgFallback: COLOR_DARK; // Notification border
shadowFg: #00000018; // Internal border shadows
slideFadeOutBg: #0000003c; // Slide animation (chat to profile) fade out filling
slideFadeOutShadowFg: windowShadowFg; // Slide animation (chat to profile) fade out right section shadow
imageBg: COLOR_BLACK; // Image background fallback (when photo size is less than minimum allowed)
imageBgTransparent: COLOR_WHITE; // Image background when displaying an image with opacity where no opacity is needed
//widgets
activeButtonBg: COLOR_GREEN_DARK; // Currently selected button background
activeButtonBgOver: #00a32b; // Mouse over currently selected button background
activeButtonBgRipple: COLOR_GREEN_RIPPLE_ACTIVE; // Primary button background color (and active chat) - Press & hold
activeButtonFg: COLOR_WHITE; // Currently selected button text
activeButtonFgOver: activeButtonFg; // Mouse over currently selected button text
activeButtonSecondaryFg: COLOR_WHITE; // Counter color on primary button
activeButtonSecondaryFgOver: COLOR_WHITE; // Counter color on primary button (hover)
activeLineFg: COLOR_GREEN_DARK; // Active input field line color (normal)
activeLineFgError: #e48383; // Active input field line color (error)
lightButtonBg: COLOR_DARK; // Secondary button background color (default)
lightButtonBgOver: #424444; // Secondary button background color (hover)
lightButtonBgRipple: #363838; // Secondary button background color (press & hold)
lightButtonFg: COLOR_WHITE; // Secondary button text color
lightButtonFgOver: lightButtonFg; // Secondary button text color (hover)
attentionButtonFg: #f73e3e; // Default attention button text (like confirm button on log out)
attentionButtonFgOver: #ffffff; // Default attention button text with mouse over
attentionButtonBgOver: #a8232e; // Default attention button background with mouse over
attentionButtonBgRipple: #d5333f; // Default attention button ripple effect
outlineButtonBg: COLOR_DARK; // Buttons background in profiles (shared media)
outlineButtonBgOver: lightButtonBgOver; // Buttons background in profiles (hover)
outlineButtonOutlineFg: windowBgActive; // Default left outlined button left outline border
outlineButtonBgRipple: lightButtonBgRipple; // Default left outlined button ripple effect
menuBg: COLOR_DARK; // Default popup menu background
menuBgOver: windowBgOver; // Default popup menu item background with mouse over
menuBgRipple: windowBgRipple; // Default popup menu item ripple effect
menuIconFg: COLOR_GRAY; // Icons color (left menu button, scroll down, paperclip..)
menuIconFgOver: COLOR_GREEN_LIGHT; // Icons color on hover (left menu button, scroll down, paperclip..)
menuSubmenuArrowFg: #373737; // Default popup menu submenu arrow icon (like in message field context menu in case of RTL system language)
menuFgDisabled: #727272; // Default popup menu item disabled text (like unavailable items in message field context menu)
menuSeparatorFg: COLOR_DARK; // Default popup menu separator (like in message field context menu)
scrollBarBg: #15cd7d53; // Scrollbar (chats list) current position
scrollBarBgOver: #15cd7d7a; // Mouse over scrollbar (chats list) current position
scrollBg: #0000001a; // Scrollbar (chats list) background
scrollBgOver: #0000002c; // Mouse over scrollbar (chats list) background
smallCloseIconFg: #c7c7c7; // Notification close button (default)
smallCloseIconFgOver: #a3a3a3; // Notification close button (hover)
radialFg: COLOR_WHITE; // Default radial loader line (like in Media Viewer when loading a photo)
radialBg: #00000056; // Default radial loader background (like in Media Viewer when loading a photo)
placeholderFg: COLOR_GRAY; // Inactive input box placeholder text
placeholderFgActive: #aaaaaa; // Active input box placeholder text
inputBorderFg: #e0e0e0; // Default input field bottom border (like in code input field when you log in and field is not focused)
filterInputBorderFg: COLOR_GREEN_DARK; // Default rounded input field border (like in chats list search field when field is focused)
filterInputInactiveBg: windowBgOver; // Default rounded input field background (like in chats list search field when field is inactive)
checkboxFg: #b3b3b3; // Default unchecked checkbox rounded rectangle (and also emoji category icons)
sliderBgInactive: #e1eaef; // Inactive media player button (prev/next song)
sliderBgActive: windowBgActive; // Active media player button (prev/next song)
tooltipBg: #eef2f5; // Tooltip background (hover on message sent time)
tooltipFg: #5d6c80; // Tooltip text color
tooltipBorderFg: #c9d1db; // Tooltip border color
// custom title bar for Windows and macOS
titleBg: COLOR_DARK; // Title bar color
titleBgActive: titleBg; // Title bar color when Telegram window is focused
titleButtonBg: titleBg; // Title bar min/max/close buttons background (Windows only)
titleShadow: #00000003; // One pixel line shadow at the bottom of custom window title
titleButtonFg: #ababab; // Title bar buttons(min/max/close) (Windows only)
titleButtonBgOver: #dbdbdb; // Title bar min/max background (hover) (Windows only)
titleButtonFgOver: #9a9a9a; // Title bar min/max icons (Windows only)
titleButtonBgActive: titleButtonBg; // Custom window title minimize/maximize/restore button background when window is active (Windows only)
titleButtonFgActive: titleButtonFg; // Custom window title minimize/maximize/restore button icon when window is active (Windows only)
titleButtonBgActiveOver: titleButtonBgOver; // Custom window title minimize/maximize/restore button background with mouse over when window is active (Windows only)
titleButtonFgActiveOver: titleButtonFgOver; // Custom window title minimize/maximize/restore button icon with mouse over when window is active (Windows only)
titleButtonCloseBg: titleButtonBg; // Custom window title close button background when window is inactive (Windows only)
titleButtonCloseFg: titleButtonFg; // Custom window title close button icon when window is inactive (Windows only)
titleButtonCloseBgOver: #e81123; // Close button background (hover)
titleButtonCloseFgOver: COLOR_WHITE; // Close button icon color (hover)
titleButtonCloseBgActive: titleButtonCloseBg; // Custom window title close button background when window is active (Windows only)
titleButtonCloseFgActive: titleButtonCloseFg; // Custom window title close button icon when window is active (Windows only)
titleButtonCloseBgActiveOver: titleButtonCloseBgOver; // Custom window title close button background with mouse over when window is active (Windows only)
titleButtonCloseFgActiveOver: titleButtonCloseFgOver; // Custom window title close button icon with mouse over when window is active (Windows only)
titleFgActive: #3e3c3e; // Active title bar text (Mac)
titleFg: #acacac; // Inactive title bar text (Mac)
// tray icon
trayCounterBg: #f23c34; // Unread messages counter background in tray (not muted, default red)
trayCounterBgMute: #888888; // Unread messages counter background in tray (muted, default gray)
trayCounterFg: COLOR_WHITE; // Unread messages counter text (number)
trayCounterBgMacInvert: COLOR_WHITE; // Tray icon counter background when tray icon is pressed or when dark theme of macOS is used (macOS only)
trayCounterFgMacInvert: COLOR_WHITE; // Tray icon counter text when tray icon is pressed or when dark theme of macOS is used (macOS only)
// layers
layerBg: #0000007f; // Box and main menu background layer fade (for example, current chat tint when forwarding message)
cancelIconFg: menuIconFg; // Default for settings close icon and box search cancel icon
cancelIconFgOver: menuIconFgOver; // Default for settings close icon and box search cancel icon with mouse over
// boxes
boxBg: COLOR_DARK; // Popup windows background color
boxTextFg: COLOR_GRAY; // Popup windows text color
boxTextFgGood: #4ab44a; // Popup windows "good" text (e.g. "Username available")
boxTextFgError: #d84d4d; // Popup windows "bad" text (e.g. "Username already taken")
boxTitleFg: COLOR_WHITE; // Popup windows titles color (sessions, contacts...)
boxSearchBg: boxBg; // Box search field background (like in contacts box)
// boxSearchCancelIconFg: cancelIconFg; // (not implemented yet) Search cancel X button icon (like in contacts box)
boxSearchCancelIconFgOver: cancelIconFgOver; // (not implemented yet) Search cancel X button icon with mouse over
boxTitleAdditionalFg: #808080; // Box title additional text (like in create group box when you see chosen members count)
boxTitleCloseFg: cancelIconFg; // Settings close icon and box search cancel icon (like in contacts box)
boxTitleCloseFgOver: cancelIconFgOver; // Settings close icon and box search cancel icon (like in contacts box) with mouse over
membersAboutLimitFg: windowSubTextFgOver; // Text in channel members box about the limit (max 200 last members are shown)
contactsBg: COLOR_DARK; // Contacts (and some other) list background color
contactsBgOver: windowBgOver; // Contacts (and some other) list mouse over background
contactsNameFg: COLOR_WHITE; // Contacts (and some other) box row name text
contactsStatusFg: COLOR_GRAY; // Contacts (and some other) box row additional text (like last seen stamp)
contactsStatusFgOver: windowSubTextFgOver; // Contacts (and some other) box row additional text (like last seen stamp) with mouse over
contactsStatusFgOnline: windowActiveTextFg; // Contacts (and some other) box row active additional text (like online status)
photoCropFadeBg: layerBg; // "Out-of-bounds" area in photo cropping (avatars etc...)
photoCropPointFg: COLOR_WHITE; // Photo crop "corners" (which you drag to crop photo)
callArrowFg: boxTextFgGood; // Received phone call arrow (in calls list box)
callArrowMissedFg: boxTextFgError; // Missed phone call arrow (in calls list box)
// intro
introBg: COLOR_DARK; // Login screen background
introTitleFg: windowBoldFg; // Login title text
introDescriptionFg: COLOR_GRAY; // Login description text
introErrorFg: COLOR_GRAY; // Login error text (like when providing a wrong log in code)
introCoverTopBg: COLOR_DARK; // Gradient finish at the top of the login screen
introCoverBottomBg: COLOR_DARK; // Gradient start at the bottom of the login screen
introCoverIconsFg: COLOR_GREEN_DARK; // Icons and clouds colors
introCoverPlaneTrace: #15cd7d69; // Plane trace
introCoverPlaneInner: #c6d8e8; // Plane color inside
introCoverPlaneOuter: #a1bed4; // Plane color outside
introCoverPlaneTop: COLOR_WHITE; // Main plane color
dialogsMenuIconFg: menuIconFg; // Main menu and lock telegram icon
dialogsMenuIconFgOver: menuIconFgOver; // Main menu and lock telegram icon with mouse over
dialogsBg: COLOR_DARK; // Chats list background color
dialogsNameFg: COLOR_WHITE; // Chat list name text
dialogsChatIconFg: dialogsNameFg; // Chat list group or channel icon
dialogsDateFg: COLOR_GRAY; // Chats list date text
dialogsTextFg: COLOR_GRAY; // Chats list message preview text
dialogsTextFgService: windowActiveTextFg; // Chats list message preview sender name
dialogsDraftFg: #dd4b39; // "Draft" word
dialogsVerifiedIconBg: windowBgActive; // Verification icon background
dialogsVerifiedIconFg: COLOR_WHITE; // Verification icon check color
dialogsSendingIconFg: #c1c1c1; // Chat list sending message icon (clock)
dialogsSentIconFg: #5dc452; // Chat list sent message tick / double tick icon
dialogsUnreadBg: COLOR_GREEN_DARK; // Chats list unread counter background
dialogsUnreadBgMuted: #999999; // Chat list unread badge background for muted chat
dialogsUnreadFg: COLOR_WHITE; // Unread counter text color
dialogsBgOver: #363838; // Inactive chat color on hover
dialogsNameFgOver: #ededed; // Chat list name text with mouse over
dialogsChatIconFgOver: dialogsNameFgOver; // Chat list group or channel icon with mouse over
dialogsDateFgOver: windowSubTextFgOver; // Chat list date text with mouse over
dialogsTextFgOver: windowSubTextFgOver; // Chat list message text with mouse over
dialogsTextFgServiceOver: dialogsTextFgService; // Mouse over chats list message preview sender name
dialogsDraftFgOver: dialogsDraftFg; // Chat list draft label with mouse over
dialogsVerifiedIconBgOver: dialogsVerifiedIconBg; // Chat list verified icon background with mouse over
dialogsVerifiedIconFgOver: dialogsVerifiedIconFg; // Chat list verified icon check with mouse over
dialogsSendingIconFgOver: dialogsSendingIconFg; // Chat list sending message icon (clock) with mouse over
dialogsSentIconFgOver: dialogsSentIconFg; // Chat list sent message tick / double tick icon with mouse over
dialogsUnreadBgOver: dialogsUnreadBg; // Chat list unread badge background for NOT muted chat with mouse over
dialogsUnreadBgMutedOver: dialogsUnreadBgMuted; // Chat list unread badge background for muted chat with mouse over
dialogsUnreadFgOver: dialogsUnreadFg; // Chat list unread badge text with mouse over
dialogsBgActive: COLOR_GREEN_DARK; // Active chat color (in chats list)
dialogsNameFgActive: COLOR_WHITE; // Active chat name text (in chats list)
dialogsChatIconFgActive: dialogsNameFgActive; // Active chat group or channel icon (in chats list)
dialogsDateFgActive: COLOR_WHITE; // Active chat date color
dialogsTextFgActive: COLOR_WHITE; // Active chat message preview color
dialogsTextFgServiceActive: dialogsTextFgActive;// Active chat service messages color
dialogsDraftFgActive: #c6e1f7; // "Draft" word when chat is selected
dialogsVerifiedIconBgActive: dialogsTextFgActive; // Active chat verified icon background (in chats list)
dialogsVerifiedIconFgActive: dialogsBgActive; // Active chat verified icon check (in chats list)
dialogsSendingIconFgActive: COLOR_WHITE; // Active chat sending message icon (clock) (in chats list)
dialogsSentIconFgActive: dialogsTextFgActive; // Active chat sent message tick / double tick icon (in chats list)
dialogsUnreadBgActive: dialogsTextFgActive; // Active chat unread badge background for NOT muted chat (in chats list)
dialogsUnreadBgMutedActive: dialogsDraftFgActive; // Active chat unread badge background for muted chat (in chats list)
dialogsUnreadFgActive: dialogsBgActive; // Active chat unread badge text (in chats list)
dialogsRippleBg: windowBgRipple;
dialogsRippleBgActive: activeButtonBgRipple;
dialogsForwardBg: dialogsBgActive; // Forwarding panel background (when forwarding messages in the smallest window size)
dialogsForwardFg: dialogsNameFgActive; // Forwarding panel text (when forwarding messages in the smallest window size)
searchedBarBg: COLOR_DARK; // Search results window background color
searchedBarFg: COLOR_GREEN_LIGHT; // Search results text color
// history
topBarBg: COLOR_DARK; // Chat header background
emojiPanBg: COLOR_DARK; // Sticker panel background
emojiPanCategories: COLOR_DARK; // Sticker panel bottom bar background
emojiPanHeaderFg: COLOR_GREEN_LIGHT; // Sticker panel title text
emojiPanHeaderBg: COLOR_DARK; // Sticker panel top bar background
stickerPanDeleteBg: #000000cc; // Delete X button background for custom sent stickers in stickers panel (legacy)
stickerPanDeleteFg: COLOR_WHITE; // Delete X button icon for custom sent stickers in stickers panel (legacy)
stickerPreviewBg: #2f2f2fCC; // Sticker and GIF preview background (when you press and hold on a sticker)
historyTextInFg: #adadad; // Incoming message text color
historyTextInFgSelected: historyTextInFg; // Selected incoming message text or text in a selected message
historyTextOutFg: #efefef; // Outgoing message text color
historyTextOutFgSelected: historyTextOutFg; // Outgoing message selected text or text in a selected message
historyLinkInFg: windowActiveTextFg; // Incoming message link color
historyLinkInFgSelected: historyLinkInFg; // Incoming message link in a selected text or message
historyLinkOutFg: windowActiveTextFg; // Outgoing message link color
historyLinkOutFgSelected: historyLinkOutFg; // Outgoing message link in a selected text or message
historyFileNameInFg: historyTextInFg; // Incoming message filename text color
historyFileNameInFgSelected: historyFileNameInFg; // Incoming media filename text in a selected message
historyFileNameOutFg: historyTextOutFg; // Outgoing message filename text color
historyFileNameOutFgSelected: historyFileNameOutFg; // Outgoing media filename text in a selected message
historyOutIconFg: dialogsSentIconFg; // "Eye" and "Checks" color for outgoing messages (selected)
historyOutIconFgSelected: COLOR_GREEN_LIGHT; // "Eye" and "Checks" color for outgoing messages (selected)
historyIconFgInverted: COLOR_WHITE; // "Checks" on stickers (outgoing)
historySendingOutIconFg: #98d292; // "Clock" icon while sending file (outgoing)
historySendingInIconFg: #a0adb5; // "Clock" icon while sending file (incoming)
historySendingInvertedIconFg: COLOR_WHITE; // Media sending message icon (clock) (like in sent photo)
historyCallArrowInFg: callArrowFg; // Received phone call arrow
historyCallArrowInFgSelected: callArrowFg; // Received phone call arrow in a selected message
historyCallArrowMissedInFg: callArrowMissedFg; // Missed phone call arrow
historyCallArrowMissedInFgSelected: callArrowMissedFg; // Missed phone call arrow in a selected message
historyCallArrowOutFg: historyCallArrowInFg; // Outgoing phone call arrow
historyCallArrowOutFgSelected: historyCallArrowInFgSelected; // Outgoing phone call arrow
historyUnreadBarBg: #424444; // Unread messages bar background color
historyUnreadBarBorder: COLOR_DARK; // Unread messages bar border color
historyUnreadBarFg: #ededed; // Unread messages bar text color
historyForwardChooseBg: #0000004c; // "Choose recipient" BACKGROUND color (forwarding)
historyForwardChooseFg: COLOR_WHITE; // "Choose recipient" text color (forwarding)
historyPeer1NameFg: #cc4d42; // Group chat sender name - Red
historyPeer1NameFgSelected: historyPeer1NameFg; // Red group member name in a selected message
historyPeer1UserpicBg: #e17076; // Group chat userpic background - Red
historyPeer2NameFg: #4fad2d; // Sender name - Green
historyPeer2NameFgSelected: historyPeer2NameFg; // Green group member name in a selected message
historyPeer2UserpicBg: #7bc862; // Userpic background - Green
historyPeer3NameFg: #d09306; // Sender name - Yellow
historyPeer3NameFgSelected: historyPeer3NameFg; // Yellow group member name in a selected message
historyPeer3UserpicBg: #e5ca77; // Userpic background - Yellow
historyPeer4NameFg: #15cd7d; // Sender name - Light green
historyPeer4NameFgSelected: historyPeer4NameFg; // Blue group member name in a selected message
historyPeer4UserpicBg: #65aadd; // Userpic background - Blue
historyPeer5NameFg: #a363f2; // Sender name - Purple
historyPeer5NameFgSelected: historyPeer5NameFg; // Purple group member name in a selected message
historyPeer5UserpicBg: #a695e7; // Userpic background - Light Purple
historyPeer6NameFg: #cd4073; // Sender name - "Raspberry"
historyPeer6NameFgSelected: historyPeer6NameFg; // "Raspberry" group member name in a selected message
historyPeer6UserpicBg: #ee7aae; // Userpic background - Light "Raspberry"
historyPeer7NameFg: #2996ad; // Sender name - Cyan
historyPeer7NameFgSelected: historyPeer7NameFg; // Cyan group member name in a selected message
historyPeer7UserpicBg: #6ec9cb; // Userpic background - Cyan
historyPeer8NameFg: #ce671b; // Sender name - Orange
historyPeer8NameFgSelected: historyPeer8NameFg; // Orange group member name in a selected message
historyPeer8UserpicBg: #faa774; // Userpic background - Light Orange
historyPeerUserpicFg: COLOR_WHITE; // Default userpic initials
// Some values are marked as (adjusted), it means they're adjusted by
// hue and saturation of the average background color if user chooses
// some other (not bundled to this color theme) background. If the
// bundled background is used those colors are not adjusted in any way.
historyScrollBarBg: #15cd7d7a; // Scrollbar (history view) background (adjusted)
historyScrollBarBgOver: #15cd7dbc; // Scrollbar (history view) background (hover) (adjusted)
historyScrollBg: #6f72724d; // Scrollbar (history view) current position background (adjusted)
historyScrollBgOver: #6f727280; // Scrollbar (history view) current position background (hover) (adjusted)
msgInBg: #3d3c3c; // Incoming message background
msgInBgSelected: #222323; // Selected incoming message background
msgOutBg: #464746; // Outgoing message background
msgOutBgSelected: #222323; // Selected outgoing message background
msgSelectOverlay: #2223239b; // Selected media (images...) overlay
msgStickerOverlay: #2223237f; // Selected sticker overlay
msgInServiceFg: windowActiveTextFg; // Incoming reply quoted name
msgInServiceFgSelected: windowActiveTextFg; // Selected incoming reply quoted name
msgOutServiceFg: COLOR_GREEN_LIGHT; // Outgoing reply quoted name
msgOutServiceFgSelected: #367570; // Selected outgoing reply quoted name
msgInShadow: #3d3c3c29; // Incoming message box shadow
msgInShadowSelected: #2f303029; // Selected incoming message box shadow
msgOutShadow: #4e4f4e40; // Outgoing message box shadow
msgOutShadowSelected: #2f303040; // Selected outgoing message box shadow
msgInDateFg: #a0acb6; // Incoming message date text
msgInDateFgSelected: COLOR_GREEN_LIGHT; // Incoming selected message date text
msgOutDateFg: COLOR_GRAY; // Outgoing message date text
msgOutDateFgSelected: COLOR_GREEN_LIGHT; // Outgoing selected message date text
msgServiceFg: COLOR_WHITE; // Service messages text color (join, left etc)
msgServiceBg: #363838; // Service messages BACKGROUND color (join, left etc) (adjusted)
msgServiceBgSelected: #8ca0b3a2; // Service message selected text background (like in a service message about group title being changed) (adjusted)
msgInReplyBarColor: COLOR_GREEN_DARK; // Incoming msg: vertical bar next to reply
msgInReplyBarSelColor: COLOR_GREEN_DARK; // Incoming msg: vertical bar next to reply (selected)
msgOutReplyBarColor: COLOR_GREEN_DARK; // Outgoing msg: vertical bar next to reply
msgOutReplyBarSelColor: COLOR_GREEN_DARK; // Outgoing msg: vertical bar next to reply (selected)
msgImgReplyBarColor: msgServiceFg; // Sticker message reply outline
msgInMonoFg: COLOR_GREEN_LIGHT; // Monowidth font / incoming msg
msgOutMonoFg: COLOR_GREEN_LIGHT; // Monowidth font / outgoing msg
msgInMonoFgSelected: msgInMonoFg; // Incoming message monospace text in a selected text or message
msgOutMonoFgSelected: msgOutMonoFg; // Outgoing message monospace text in a selected text or message
msgDateImgFg: msgServiceFg; // Media message time text (like time text in a sent photo)
msgDateImgBg: #00000054; // Media message time bubble background (like time bubble in a sent photo) or file with thumbnail download icon circle background
msgDateImgBgOver: #00000074; // Media message download icon circle background with mouse over (like file with thumbnail download icon)
msgDateImgBgSelected: #1c4a7187; // Selected media message time bubble background
msgFileThumbLinkInFg: lightButtonFg; // Incoming media file message with thumbnail download / open with button text
msgFileThumbLinkInFgSelected: lightButtonFgOver; // Incoming selected media file message with thumbnail download / open with button text
msgFileThumbLinkOutFg: #5eba5b; // Outgoing media file message with thumbnail download / open with button text
msgFileThumbLinkOutFgSelected: #31a298; // Outgoing selected media file message with thumbnail download / open with button text
msgFileInBg: windowBgActive; // Incoming audio file download circle background
msgFileInBgOver: #63b56a; // Incoming audio file download circle background with mouse over
msgFileInBgSelected: #63b56a; // Incoming selected audio file download circle background
msgFileOutBg: COLOR_GREEN_DARK; // Outgoing audio file download circle background
msgFileOutBgOver: #6bc272; // Outgoing audio file download circle background with mouse over
msgFileOutBgSelected: #5fb389; // Outgoing selected audio file download circle background
msgFile1Bg: #72b1df; // Blue shared links / files without image square thumbnail
msgFile1BgDark: #5c9ece; // Blue shared files without image download circle background
msgFile1BgOver: #5294c4; // Blue shared files without image download circle background with mouse over
msgFile1BgSelected: #5099d0; // Blue shared files without image download circle background if file is selected
msgFile2Bg: #61b96e; // Green shared links / shared files without image square thumbnail
msgFile2BgDark: #4da859; // Green shared files without image download circle background
msgFile2BgOver: #44a050; // Green shared files without image download circle background with mouse over
msgFile2BgSelected: #46a07e; // Green shared files without image download circle background if file is selected
msgFile3Bg: #e47272; // Red shared links / shared files without image square thumbnail
msgFile3BgDark: #cd5b5e; // Red shared files without image download circle background
msgFile3BgOver: #c35154; // Red shared files without image download circle background with mouse over
msgFile3BgSelected: #9f6a82; // Red shared files without image download circle background if file is selected
msgFile4Bg: #efc274; // Yellow shared links / shared files without image square thumbnail
msgFile4BgDark: #e6a561; // Yellow shared files without image download circle background
msgFile4BgOver: #dc9c5a; // Yellow shared files without image download circle background with mouse over
msgFile4BgSelected: #b19d84; // Yellow shared files without image download circle background if file is selected
historyFileInIconFg: COLOR_WHITE; // Incoming file without thumbnail (like audio file) download arrow icon
historyFileInIconFgSelected: COLOR_WHITE; // Incoming selected file without thumbnail (like audio file) download arrow icon
historyFileInRadialFg: COLOR_WHITE; // Incoming file without thumbnail (like audio file) radial download animation line
historyFileInRadialFgSelected: COLOR_WHITE; // Incoming selected file without thumbnail (like audio file) radial download animation line
historyFileOutIconFg: COLOR_WHITE; // Outgoing file without thumbnail (like audio file) download arrow icon
historyFileOutIconFgSelected: COLOR_WHITE; // Outgoing selected file without thumbnail (like audio file) download arrow icon
historyFileOutRadialFg: COLOR_WHITE; // Outgoing file without thumbnail (like audio file) radial download animation line
historyFileOutRadialFgSelected: COLOR_WHITE; // Outgoing selected file without thumbnail (like audio file) radial download animation line
historyFileThumbIconFg: COLOR_WHITE; // File with thumbnail (or photo / video) download arrow icon
historyFileThumbIconFgSelected: COLOR_WHITE; // Selected file with thumbnail (or photo / video) download arrow icon
historyFileThumbRadialFg: COLOR_WHITE; // File with thumbnail (or photo / video) radial download animation line
historyFileThumbRadialFgSelected: COLOR_WHITE; // Selected file with thumbnail (or photo / video) radial download animation line
historyVideoMessageProgressFg: historyFileThumbIconFg; // Radial playback progress in round video messages
msgWaveformInActive: windowBgActive; // Incoming Voice "heard" part
msgWaveformInActiveSelected: COLOR_GREEN_LIGHT; // Selected incoming Voice "heard" part
msgWaveformInInactive: #d4dee6; // Incoming Voice "unheard" part
msgWaveformInInactiveSelected: COLOR_WHITE; // Selected incoming Voice "unheard" part
msgWaveformOutActive: windowBgActive; // Outgoing Voice "heard" part
msgWaveformOutActiveSelected: COLOR_GREEN_LIGHT;// Selected outgoing Voice "heard" part
msgWaveformOutInactive: COLOR_WHITE; // Outgoing Voice "unheard" part
msgWaveformOutInactiveSelected: COLOR_WHITE; // Selected outgoing Voice "unheard" part
msgBotKbOverBgAdd: COLOR_DARK; // Inline button (hover)
msgBotKbIconFg: COLOR_WHITE; // Inline button icon color (URL Buttons, for example)
msgBotKbRippleBg: #00000020; // Inline button (press & hold)
mediaInFg: msgInDateFg; // Incoming media message status text (like in file that is being downloaded)
mediaInFgSelected: msgInDateFgSelected; // Incoming selected media message status text (like in file that is being downloaded)
mediaOutFg: msgOutDateFg; // Outgoing media message status text (like in file that is being downloaded)
mediaOutFgSelected: msgOutDateFgSelected; // Outgoing selected media message status text (like in file that is being downloaded)
youtubePlayIconBg: #e83131c8; // Youtube play icon background (when a link to a youtube video with a webpage preview is sent)
youtubePlayIconFg: COLOR_WHITE; // Youtube play icon arrow (when a link to a youtube video with a webpage preview is sent)
videoPlayIconBg: #0000007f; // Other video play icon background (like when a link to a vimeo video with a webpage preview is sent)
videoPlayIconFg: COLOR_WHITE; // Other video play icon arrow (like when a link to a vimeo video with a webpage preview is sent)
toastBg: #000000b2; // Toast notification background (like when you click on your t.me link when editing your username)
toastFg: COLOR_WHITE; // Toast notification text (like when you click on your t.me link when editing your username)
reportSpamBg: emojiPanHeaderBg; // Report spam panel background (like a non contact user writes your for the first time)
reportSpamFg: COLOR_GRAY; // Report spam panel text (when you send a report from that panel)
historyToDownBg: #424444; // "Scroll to bottom" button background
historyToDownBgOver: windowBgOver; // "Scroll to bottom" button background (hover)
historyToDownBgRipple: windowBgRipple; // "Scroll to bottom" button background (press & hold)
historyToDownFg: menuIconFg; // "Scroll to bottom" internal icon color
historyToDownFgOver: menuIconFgOver; // "Scroll to bottom" internal icon color (hover)
historyToDownShadow: #00000040; // "Scroll to bottom" button shadow
historyComposeAreaBg: msgInBg; // Text input field background
historyComposeAreaFg: COLOR_WHITE; // Text color in "Type your message" field
historyComposeAreaFgService: msgInDateFg; // Text color in "Type your message" field when replying to a media message
historyComposeIconFg: menuIconFg; // Text input field: Paperclip, Smile, Bot command icons
historyComposeIconFgOver: COLOR_GREEN_LIGHT; // Text input field: Paperclip, Smile, Bot command icons (hover)
historySendIconFg: #0f8c56; // Text input field: Send icon
historySendIconFgOver: #11a364; // Text input field: Send icon (hover)
historyPinnedBg: historyComposeAreaBg; // Pinned message area background
historyReplyBg: historyComposeAreaBg; // Reply / forward / edit message area background
historyReplyIconFg: windowBgActive; // Reply / forward / edit message left icon
historyReplyCancelFg: cancelIconFg; // Reply / forward / edit message cancel button
historyReplyCancelFgOver: cancelIconFgOver; // Reply / forward / edit message cancel button with mouse over
historyComposeButtonBg: historyComposeAreaBg; // Unblock / join channel / mute channel button background
historyComposeButtonBgOver: windowBgOver; // Unblock / join channel / mute channel button background with mouse over
historyComposeButtonBgRipple: windowBgRipple; // Unblock / join channel / mute channel button ripple effect
// overview
overviewCheckBg: #00000040; // Shared files / links checkbox background for not selected rows when some rows are selected
overviewCheckFg: COLOR_DARK; // Shared files / links checkbox icon for not selected rows when some rows are selected
overviewCheckFgActive: COLOR_DARK; // Shared files / links checkbox icon for selected rows
overviewPhotoSelectOverlay: #40ace333; // Shared photos / videos / links fill for selected rows
// profile
profileStatusFgOver: #7c99b2; // Group members list in group profile user last seen text with mouse over
profileVerifiedCheckBg: windowBgActive; // Profile verified check icon background
profileVerifiedCheckFg: windowFgActive; // Profile verified check icon tick
profileAdminStartFg: COLOR_GREEN_LIGHT; // Star color for group/channhel admins and moderators (look in members list)
// settings
notificationsBoxMonitorFg: COLOR_GRAY; // Custom notifications settings box monitor color
notificationsBoxScreenBg: dialogsBgActive; // Custom notifications settings box monitor screen background
notificationSampleUserpicFg: windowBgActive; // Custom notifications settings box small sample userpic placeholder
notificationSampleCloseFg: #d7d7d7; // Custom notifications settings box small sample close button placeholder
notificationSampleTextFg: #d7d7d7; // Custom notifications settings box small sample text placeholder
notificationSampleNameFg: #939393; // Custom notifications settings box small sample name placeholder
changePhoneSimcardFrom: notificationSampleTextFg; // Change phone number box left simcard icon
changePhoneSimcardTo: notificationSampleNameFg; // Change phone number box right simcard and plane icons
mainMenuBg: COLOR_DARK; // Left menu background (lower part, not buttons)
mainMenuCoverBg: dialogsBgActive; // Left menu background (upper part)
mainMenuCoverFg: COLOR_WHITE; // Main menu top cover text
mainMenuCloudFg: activeButtonFg; // "Cloud" icon in main menu
mainMenuCloudBg: activeButtonBgRipple; // "Cloud" icon background in main menu
mediaPlayerBg: COLOR_DARK; // Music player background
mediaPlayerActiveFg: COLOR_GREEN_DARK; // Clickable Next song/Prev song button in music player + played part color
mediaPlayerInactiveFg: #4f5151; // "Disabled" Next song/Prev song button in music player + not player part color
mediaPlayerDisabledFg: #9dd1ef; // Music player audio loading progress (when you're playing an audio file and switch to the previous one which is not loaded yet)
// mediaview
mediaviewFileBg: COLOR_DARK; // File rectangle background (when you view a png file in Media Viewer and go to a previous, not loaded yet, file)
mediaviewFileNameFg: COLOR_GRAY; // File name in file rectangle
mediaviewFileSizeFg: COLOR_GRAY; // File size text in file rectangle
mediaviewFileRedCornerFg: #d55959; // Red file thumbnail placeholder corner in file rectangle (for a file without thumbnail, like .pdf)
mediaviewFileYellowCornerFg: #e8a659; // Yellow file thumbnail placeholder corner in file rectangle (for a file without thumbnail, like .zip)
mediaviewFileGreenCornerFg: #49a957; // Green file thumbnail placeholder corner in file rectangle (for a file without thumbnail, like .exe)
mediaviewFileBlueCornerFg: #599dcf; // Blue file thumbnail placeholder corner in file rectangle (for a file without thumbnail, like .dmg)
mediaviewFileExtFg: activeButtonFg; // File extension text in file thumbnail placeholder in file rectangle
mediaviewMenuBg: #383838; // Context menu in Media Viewer background
mediaviewMenuBgOver: #505050; // Menu items background (hover)
mediaviewMenuBgRipple: #676767; // Menu items background (press & hold)
mediaviewMenuFg: COLOR_WHITE; // Text color in media view menu
mediaviewBg: #222222eb; // Media Viewer background
mediaviewVideoBg: imageBg; // Media Viewer background when viewing a video in full screen
mediaviewControlBg: #0000003c; // Controls background (like next photo / previous photo)
mediaviewControlFg: COLOR_WHITE; // Controls icon (like next photo / previous photo)
mediaviewCaptionBg: #11111180; // Caption text background (when viewing photo with caption)
mediaviewCaptionFg: mediaviewControlFg; // Caption text color
mediaviewTextLinkFg: #91d9ff; // Links color in captions
mediaviewSaveMsgBg: toastBg; // 'Something was saved to % folder' message background
mediaviewSaveMsgFg: toastFg; // 'Something was saved to % folder' message text color
mediaviewPlaybackActive: #c7c7c7; // Video playback progress already played part
mediaviewPlaybackInactive: #252525; // Video playback progress upcoming (not played yet) part
mediaviewPlaybackActiveOver: COLOR_WHITE; // Video playback progress already played part with mouse over
mediaviewPlaybackInactiveOver: #474747; // Video playback progress upcoming (not played yet) part with mouse over
mediaviewPlaybackProgressFg: COLOR_WHITE; // Video playback progress text
mediaviewPlaybackIconFg: mediaviewPlaybackActive; // Video playback controls icon
mediaviewPlaybackIconFgOver: mediaviewPlaybackActiveOver; // Video playback controls icon with mouse over
mediaviewTransparentBg: COLOR_WHITE; // Transparent filling part (when viewing a transparent .png file in Media Viewer)
mediaviewTransparentFg: #cccccc; // Another transparent filling part
// notification
notificationBg: COLOR_DARK; // Notification background
// calls
callBg: #26282cf2; // Phone call popup background
callNameFg: #ffffff; // Phone call popup name text
callFingerprintBg: #00000066; // Phone call popup emoji fingerprint background
callStatusFg: #aaabac; // Phone call popup status text
callIconFg: #ffffff; // Phone call popup answer, hangup and mute mic icon
callAnswerBg: #64c15b; // Phone call popup answer button background
callAnswerRipple: #52b149; // Phone call popup answer button ripple effect
callAnswerBgOuter: #50eb4126; // Phone call popup answer button outer ripple effect
callHangupBg: #d75a5a; // Phone call popup hangup button background
callHangupRipple: #c04646; // Phone call popup hangup button ripple effect
callCancelBg: #ffffff; // Phone call popup line busy cancel button background
callCancelFg: #777777; // Phone call popup line busy cancel button icon
callCancelRipple: #f1f1f1; // Phone call popup line busy cancel button ripple effect
callMuteRipple: #ffffff12; // Phone call popup mute mic ripple effect
callBarBg: dialogsBgActive; // Active phone call bar background
callBarMuteRipple: dialogsRippleBgActive; // Active phone call bar mute and hangup button ripple effect
callBarBgMuted: dialogsUnreadBgMuted; // Phone call bar with muted mic background
callBarUnmuteRipple: shadowFg; // Phone call bar with muted mic mute and hangup button ripple effect
callBarFg: dialogsNameFgActive; // Phone call bar text and icons