// Description: Dracula Theme // Version: v0.1.3 // Repository: https://github.com/dracula/telegram // Initial Author: Neil Smith // Initial Repository: https://github.com/nmsmith22389/dracula-telegram // Color Pallete pBg: #282a36; pSelection: #44475a; pFg: #f8f8f2; pComment: #6272a4; pCyan: #8be9fd; pGreen: #50fa7b; pOrange: #ffb86c; pPink: #ff79c6; pPurple: #bd93f9; pRed: #ff5555; pYellow: #f1fa8c; pAnthracite: #212020; // Color Vars rippleBgHeavy: #ffffff40; rippleBgLight: #ffffff20; cBlack: #000000; cWhite: #ffffff; cTransparent: #00000000; windowBg: pBg; // Main bg windowFg: pFg; // Text color etc. windowBgOver: pSelection; // Generic bg hover color (random bits and pieces) & Search bar bg windowBgRipple: rippleBgLight; // Ripple color (on hover colored items) [te] windowFgOver: windowFg; // Text color on hover windowSubTextFg: pComment; // Minor text and some labels (version number, last seen, etc.) windowSubTextFgOver: pPurple; // Hotkey hover text color? windowBoldFg: pYellow; // Bolded text (headers) [te] windowBoldFgOver: windowBoldFg; // windowBoldFg but on hover (idk where used) windowBgActive: pGreen; // Checked radio and checkbox color windowFgActive: pBg; // Button Text [te] windowActiveTextFg: pCyan; // Hyperlink text color (and text input active labels) windowShadowFg: #000000f0; // [te] windowShadowFgFallback: cBlack; // [te] shadowFg: cTransparent; // [te] slideFadeOutBg: windowBg; // ??? slideFadeOutShadowFg: cTransparent; // ??? [te] imageBg: cBlack; // ??? imageBgTransparent: cWhite; // ??? activeButtonBg: pComment; // Raised Button bg activeButtonBgOver: pPurple; // Raised Button hover bg activeButtonBgRipple: rippleBgHeavy; // Raised Button ripple color (and slected chat contact ripple?) activeButtonFg: windowBg; // Raised Button text color activeButtonFgOver: activeButtonFg; // Raised Button hover text color activeButtonSecondaryFg: pFg; // Numbers (badges) text color on raised buttons activeButtonSecondaryFgOver: activeButtonSecondaryFg; // activeButtonSecondaryFg on hover activeLineFg: windowActiveTextFg; // Active text input bottom border color activeLineFgError: pRed; // activeLineFg but on error lightButtonBg: windowBg; // Flat button bg color lightButtonBgOver: pSelection; // Flat button bg color on hover lightButtonBgRipple: rippleBgLight; // Flat button ripple color lightButtonFg: pComment; // Flat button text color [te] lightButtonFgOver: activeButtonBgOver; // Flat button text color on hover attentionButtonFg: pRed; // Warning button text color attentionButtonFgOver: attentionButtonFg; // Warning button text color hover attentionButtonBgOver: #ff555540; // Warning button bg color hover !!(pRed with transparency)!! [te] attentionButtonBgRipple: rippleBgLight; // Warning button ripple color // Outline buttons are flat btns that get a little indicator when hovered outlineButtonBg: windowBg; // Outline Button bg outlineButtonBgOver: pSelection; // Outline Button bg on hover [te] outlineButtonOutlineFg: windowActiveTextFg; // Outline Button indicator color outlineButtonBgRipple: rippleBgLight; // Outline Button ripple color menuBg: windowBg; // Menu bg color menuBgOver: windowBgOver; // Menu bg color on hover menuBgRipple: windowBgRipple; // Icon ripple color // Menu Icons are icons that appear popup windows menuIconFg: pComment; // Menu Icon text color menuIconFgOver: pPurple; // Menu Icon text color on hover menuSubmenuArrowFg: pComment; // ??? menuFgDisabled: pSelection; // Disabled menu text color menuSeparatorFg: #f8f8f210; // [te] scrollBarBg: pComment; // Scroll Bar current slider color (indicator) scrollBarBgOver: pPurple; // Scroll Bar current slider color on hover scrollBg: pSelection; // Scroll Bar track bg color scrollBgOver: scrollBg; // Scroll Bar track bg color on hover smallCloseIconFg: pComment; // Small menu close button color (its tiny) smallCloseIconFgOver: pRed; // smallCloseIconFg on hover [te] radialFg: pPink; // ??? [te] radialBg: pSelection; // ??? [te] placeholderFg: pSelection; //windowSubTextFg; [te] placeholderFgActive: pComment; inputBorderFg: pComment; // Input text field undeline when not active filterInputBorderFg: pComment; // Search box active border checkboxFg: pComment; // checkbox inactive border [te] sliderBgInactive: pSelection; // windowBgActive; sliderBgActive: pGreen; // A slider is the bottom border on tabs that slides around tooltipBg: #44475aa0; // [te] tooltipFg: pFg; // [te] tooltipBorderFg: cTransparent; // [te] titleBg: pBg; // Window top bar bg color titleShadow: cTransparent; titleButtonFg: pSelection; // [te] titleButtonBgOver: cTransparent; // ??? [te] titleButtonFgOver: pOrange; // ??? [te] titleButtonCloseBgOver: cTransparent; // ??? [te] titleButtonCloseFgOver: pRed; // ??? [te] titleFgActive: pPurple; // Window Title color when active [te] titleFg: pComment; // Window Title color trayCounterBg: pRed; // Tray icon counter background for unread messages trayCounterBgMute: pBg; // ??? [te] trayCounterFg: pFg; // ??? [te] trayCounterBgMacInvert: pComment; // ??? [te] trayCounterFgMacInvert: pFg; // ??? [te] layerBg: #44475a66; // bg overlay when menu is up [te] cancelIconFg: menuIconFg; // Main close menu color (like option close) cancelIconFgOver: pRed; // & on hover [te] boxBg: windowBg; boxTextFg: windowFg; boxTextFgGood: pGreen; boxTextFgError: pRed; boxTitleFg: cWhite; boxSearchBg: boxBg; boxSearchCancelIconFg: cancelIconFg; boxSearchCancelIconFgOver: cancelIconFgOver; boxTitleAdditionalFg: pCyan; // [te] boxTitleCloseFg: cancelIconFg; boxTitleCloseFgOver: cancelIconFgOver; membersAboutLimitFg: pRed; // [te] contactsBg: windowBg; // Contact bg color on contacts page contactsBgOver: windowBgOver; contactsNameFg: pYellow; // Contact name color on contacts page [te] contactsStatusFg: windowSubTextFg; // Contact status color on contacts page contactsStatusFgOver: windowSubTextFgOver; contactsStatusFgOnline: windowActiveTextFg; photoCropFadeBg: layerBg; photoCropPointFg: pComment; introBg: windowBg; introTitleFg: windowBoldFg; introDescriptionFg: windowSubTextFg; introErrorFg: pRed; // [te] introCoverTopBg: pBg; // [te] introCoverBottomBg: pBg; // [te] introCoverIconsFg: pComment; // [te] introCoverPlaneTrace: pCyan; // [te] introCoverPlaneInner: pCyan; // [te] introCoverPlaneOuter: pCyan; // [te] introCoverPlaneTop: pCyan; // [te] dialogsMenuIconFg: menuIconFg; // menu hamburger color dialogsMenuIconFgOver: menuIconFgOver; dialogsBg: windowBg; dialogsNameFg: windowBoldFg; // Chat names color dialogsChatIconFg: pOrange; // [te] dialogsDateFg: windowSubTextFg; dialogsTextFg: windowSubTextFg; dialogsTextFgService: windowActiveTextFg; dialogsDraftFg: pRed; // Draft label color dialogsVerifiedIconBg: pCyan; // verified icon bg [te] dialogsVerifiedIconFg: pBg; // verified icon text color [te] dialogsSendingIconFg: pOrange; // ??? little clock icon on chat contact (the ones on left sidebar) when sending dialogsSentIconFg: pGreen; dialogsUnreadBg: pComment; // [te] dialogsUnreadBgMuted: pSelection; // [te] dialogsUnreadFg: pFg; // [te] dialogsBgOver: windowBgOver; dialogsNameFgOver: windowBoldFgOver; dialogsChatIconFgOver: dialogsChatIconFg; dialogsDateFgOver: windowSubTextFgOver; dialogsTextFgOver: windowSubTextFgOver; dialogsTextFgServiceOver: dialogsTextFgService; dialogsDraftFgOver: dialogsDraftFg; dialogsVerifiedIconBgOver: dialogsVerifiedIconBg; dialogsVerifiedIconFgOver: dialogsVerifiedIconFg; dialogsSendingIconFgOver: dialogsSendingIconFg; dialogsSentIconFgOver: dialogsSentIconFg; dialogsUnreadBgOver: dialogsUnreadBg; dialogsUnreadBgMutedOver: dialogsUnreadBgMuted; dialogsUnreadFgOver: dialogsUnreadFg; dialogsBgActive: pSelection; dialogsNameFgActive: pPink; dialogsChatIconFgActive: pPurple; dialogsDateFgActive: windowActiveTextFg; dialogsTextFgActive: windowActiveTextFg; dialogsTextFgServiceActive: pOrange; // [te] dialogsDraftFgActive: dialogsDraftFg; dialogsVerifiedIconBgActive: dialogsVerifiedIconBg; dialogsVerifiedIconFgActive: dialogsVerifiedIconFg; dialogsSendingIconFgActive: dialogsSendingIconFg; dialogsSentIconFgActive: dialogsSentIconFg; dialogsUnreadBgActive: dialogsUnreadBg; dialogsUnreadBgMutedActive: dialogsUnreadBgMuted; dialogsUnreadFgActive: dialogsUnreadFg; dialogsForwardBg: dialogsBgActive; dialogsForwardFg: pCyan; // [te] searchedBarBg: pBg; // Results & 'no msgs found' msg in search results [te] searchedBarBorder: cTransparent; // [te] searchedBarFg: pPink; // Text 'Search for messages' in search results. [te] topBarBg: windowBg; emojiPanBg: windowBg; // Emoji window bg emojiPanCategories: emojiPanBg; emojiPanHeaderFg: windowSubTextFg; emojiPanHeaderBg: emojiPanBg; stickerPanDeleteBg: #ff555540; // [te] stickerPanDeleteFg: pRed; // windowFgActive; [te] stickerPreviewBg: cTransparent; historyTextInFg: windowFg; historyTextOutFg: windowFg; historyCaptionInFg: historyTextInFg; historyCaptionOutFg: historyTextOutFg; historyFileNameInFg: historyTextInFg; historyFileNameOutFg: historyTextOutFg; historyOutIconFg: pGreen; historyOutIconFgSelected: pGreen; historyIconFgInverted: pGreen; // [te] historySendingOutIconFg: pOrange; // [te] historySendingInIconFg: pOrange; // [te] historySendingInvertedIconFg: pOrange; // little 'eye' icon on some media msgs (ie sticker, image) to indicate views? [te] historySystemBg: pYellow; // [te] historySystemBgSelected: pOrange; // [te] historySystemFg: pBg; // windowFgActive; [te] historyUnreadBarBg: pSelection; historyUnreadBarBorder: pSelection; historyUnreadBarFg: cWhite; historyForwardChooseBg: pComment; historyForwardChooseFg: cWhite; historyPeer1NameFg: pRed; // [te] historyPeer1UserpicBg: pRed; // [te] historyPeer2NameFg: pGreen; // [te] historyPeer2UserpicBg: pGreen; // [te] historyPeer3NameFg: pYellow; // [te] historyPeer3UserpicBg: pYellow; // [te] historyPeer4NameFg: pCyan; // [te] historyPeer4UserpicBg: pCyan; // [te] historyPeer5NameFg: pPurple; // [te] historyPeer5UserpicBg: pPurple; // [te] historyPeer6NameFg: pPink; // [te] historyPeer6UserpicBg: pPink; // [te] historyPeer7NameFg: pAnthracite; // [te] historyPeer7UserpicBg: pAnthracite; // [te] historyPeer8NameFg: pOrange; // [te] historyPeer8UserpicBg: pOrange; // [te] historyPeerUserpicFg: pBg; // [te] historyScrollBarBg: scrollBarBg; historyScrollBarBgOver: scrollBarBgOver; historyScrollBg: scrollBg; historyScrollBgOver: scrollBgOver; msgInBg: pComment; msgInBgSelected: pPink; msgOutBg: pSelection; msgOutBgSelected: pPurple; msgSelectOverlay: rippleBgLight; msgStickerOverlay: rippleBgHeavy; msgInServiceFg: windowActiveTextFg; // Chat name color when system message in (ie the computer... Forwarded by, Channels, etc) msgInServiceFgSelected: windowActiveTextFg; // msgInServiceFg when selected msgOutServiceFg: windowActiveTextFg; // msgInServiceFg but out instead msgOutServiceFgSelected: windowActiveTextFg; // msgOutServiceFg when selected msgInShadow: cTransparent; msgInShadowSelected: cTransparent; msgOutShadow: cTransparent; msgOutShadowSelected: cTransparent; msgInDateFg: #8beafdcc; // Date in IN msg (text color) [ie time recieved] [te] msgInDateFgSelected: #282a3690; // msgInDateFG but when msg is selected [te] msgOutDateFg: #8beafdcc; // Date in OUT msg (text color) [ie time sent] [te] msgOutDateFgSelected: #282a3690; // msgOutDateFG but when msg is selected [te] msgServiceFg: #282a36cc; // [te] msgServiceBg: #6272a4cc; // Sticker reply, dates in chat history, bot buttons [te] msgServiceBgSelected: #ff79c7cc; // [te] msgInReplyBarColor: activeLineFg; msgInReplyBarSelColor: activeLineFg; msgOutReplyBarColor: activeLineFg; msgOutReplyBarSelColor: activeLineFg; msgImgReplyBarColor: activeLineFg; msgInMonoFg: pOrange; // [te] msgOutMonoFg: pOrange; // [te] msgDateImgFg: windowFg; msgDateImgBg: windowBg; msgDateImgBgOver: windowBgOver; msgDateImgBgSelected: windowBgOver; msgFileThumbLinkInFg: pYellow; // [te] msgFileThumbLinkInFgSelected: pComment; // [te] msgFileThumbLinkOutFg: pYellow; // [te] msgFileThumbLinkOutFgSelected: pComment; // [te] msgFileInBg: pPink; // [te] msgFileInBgOver: pFg; // [te] msgFileInBgSelected: pComment; // [te] msgFileOutBg: #bc94f9; // [te] msgFileOutBgOver: pFg; // [te] msgFileOutBgSelected: pSelection; // [te] msgFile1Bg: pCyan; // [te] msgFile1BgDark: #38d9fc; // [te] msgFile1BgOver: #59e0fc; // [te] msgFile1BgSelected: #bdf2fe; // [te] msgFile2Bg: pGreen; // [te] msgFile2BgDark: #07ee41; // [te] msgFile2BgOver: #1df954; // [te] msgFile2BgSelected: #82fba0; // [te] msgFile3Bg: pRed; // [te] msgFile3BgDark: #ff0000; // [te] msgFile3BgOver: #ff2222; // [te] msgFile3BgSelected: #ff8888; // [te] msgFile4Bg: pYellow; // [te] msgFile4BgDark: #e7f63b; // [te] msgFile4BgOver: #ebf85b; // [te] msgFile4BgSelected: #f7fcbd; // [te] msgWaveformInActive: pGreen; // Waveforms for audio messages (active is the played part) msgWaveformInActiveSelected: pGreen; msgWaveformInInactive: windowBg; msgWaveformInInactiveSelected: windowBg; msgWaveformOutActive: pGreen; msgWaveformOutActiveSelected: pGreen; msgWaveformOutInactive: windowBg; msgWaveformOutInactiveSelected: windowBg; msgBotKbOverBgAdd: rippleBgLight; // [te] msgBotKbIconFg: pBg; // [te] msgBotKbRippleBg: activeButtonBgRipple; //menuBgRipple; // Bot (system) chat buttons [ie theme like/dislike] mediaInFg: pOrange; // [te] mediaInFgSelected: pOrange; // [te] mediaOutFg: pOrange; // [te] mediaOutFgSelected: pOrange; // [te] youtubePlayIconBg: pRed; youtubePlayIconFg: pFg; videoPlayIconBg: pComment; // [te] videoPlayIconFg: pFg; // [te] toastBg: pComment; // [te] toastFg: cWhite; reportSpamBg: emojiPanHeaderBg; reportSpamFg: windowFg; historyToDownShadow: cTransparent; historyComposeAreaBg: windowBg; historyComposeAreaFg: historyTextInFg; historyComposeAreaFgService: pFg; // [te] historyComposeIconFg: menuIconFg; // Bottom chat icons (Attach File, Emoji, Microphone) historyComposeIconFgOver: menuIconFgOver; historySendIconFg: menuIconFg; // Paper plane icon that shows when text is typed (click to send) historySendIconFgOver: pGreen; // [te] historyPinnedBg: windowBg; historyReplyBg: historyComposeAreaBg; historyReplyCancelFg: cancelIconFg; historyReplyCancelFgOver: pRed; // [te] historyComposeButtonBg: historyComposeAreaBg; historyComposeButtonBgOver: windowBgOver; historyComposeButtonBgRipple: windowBgRipple; overviewCheckBg: cTransparent; // [te] overviewCheckFg: windowBg; overviewCheckFgActive: windowBg; overviewPhotoSelectOverlay: rippleBgHeavy; // [te] profileStatusFgOver: pPurple; notificationsBoxMonitorFg: windowFg; notificationsBoxScreenBg: pSelection; // [te] notificationSampleUserpicFg: pCyan; // [te] notificationSampleCloseFg: pRed; // [te] notificationSampleTextFg: pFg; // [te] notificationSampleNameFg: pYellow; // [te] mainMenuBg: windowBg; mainMenuCoverBg: pSelection; // [te] mainMenuCoverFg: pGreen; // [te] mediaPlayerBg: pBg; // [te] mediaPlayerActiveFg: pGreen; // [te] mediaPlayerInactiveFg: pComment; // [te] mediaPlayerDisabledFg: pSelection; // [te] mediaviewFileBg: pSelection; // [te] mediaviewFileNameFg: windowFg; mediaviewFileSizeFg: pOrange; //windowSubTextFg; [te] mediaviewFileRedCornerFg: #ff0000; // [te] mediaviewFileYellowCornerFg: #e7f63b; // [te] mediaviewFileGreenCornerFg: #07ee41; // [te] mediaviewFileBlueCornerFg: #38d9fc; // [te] mediaviewFileExtFg: pBg; // [te] mediaviewMenuBg: pBg; // [te] mediaviewMenuBgOver: pSelection; // [te] mediaviewMenuBgRipple: rippleBgLight; // [te] mediaviewMenuFg: pFg; // windowFgActive; [te] mediaviewBg: #282a36e0; // [te] mediaviewVideoBg: imageBg; mediaviewControlBg: pBg; // [te] mediaviewControlFg: pComment; // windowFgActive; [te] mediaviewCaptionBg: pBg; // [te] mediaviewCaptionFg: cWhite; mediaviewTextLinkFg: pCyan; // [te] mediaviewSaveMsgBg: toastBg; mediaviewSaveMsgFg: toastFg; mediaviewPlaybackActive: pGreen; // video playback progress already played part mediaviewPlaybackInactive: pSelection; // video playback progress upcoming (not played yet) part mediaviewPlaybackActiveOver: pPink; // video playback progress already played part with mouse over mediaviewPlaybackInactiveOver: pComment; // video playback progress upcoming (not played yet) part with mouse over mediaviewPlaybackProgressFg: pFg; // video playback progress text mediaviewPlaybackIconFg: pGreen; // video playback controls icon mediaviewPlaybackIconFgOver: pPink; // video playback controls icon with mouse over mediaviewPipControlsFg: pGreen; // picture-in-picture controls mediaviewPipControlsFgOver : pPink; // picture-in-picture controls with mouse over mediaviewPipFade : pBg; // picture-in-picture gradient fade controls background mediaviewPipPlaybackActive : pGreen; // picture-in-picture playback progress already played part mediaviewPipPlaybackInactive: pSelection; // picture-in-picture playback progress upcoming (not played yet) part mediaviewTransparentBg: cBlack; // [te] mediaviewTransparentFg: #666666; // [te] notificationBg: windowBg; titleButtonBg: cTransparent; // [te] titleButtonBgActive: cTransparent; // [te] titleButtonBgActiveOver: pSelection; // [te] titleButtonFgActiveOver: pOrange; // [te] titleButtonFgActive: pOrange; // [te] titleButtonCloseBg: cTransparent; // [te] titleButtonCloseFg: pSelection; // [te] titleButtonCloseBgActive: cTransparent; // [te] titleButtonCloseFgActive: pRed; // [te] titleButtonCloseBgActiveOver: pSelection; // [te] titleButtonCloseFgActiveOver: titleButtonCloseFgOver; filterInputInactiveBg: #44475a20; // [te] profileVerifiedCheckBg: pCyan; // [te] historyReplyIconFg: windowBgActive; historyToDownBg: #282a36cc; // [te] titleBgActive: pBg; // [te] sideBarBg: pBg; // filters side bar background sideBarBgActive: pSelection; // filters side bar active background sideBarBgRipple: rippleBgHeavy; // filters side bar ripple effect sideBarTextFg: pYellow; // filters side bar text sideBarTextFgActive: pPink; // filters side bar active item text sideBarIconFg: pComment; // filters side bar icon sideBarIconFgActive: pPurple; // filters side bar active item icon sideBarBadgeBg: pPurple; // filters side bar badge background sideBarBadgeBgMuted: pSelection; // filters side bar unimportant badge background sideBarBadgeFg: pFg; // filters side bar badge text