Advertisement
DarkulYT

Krunker main dark theme css

Sep 22nd, 2020 (edited)
3,189
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 6.28 KB | None | 0 0
  1. /***********************************************************************
  2.         Version 1.3 - last edit 30 September
  3. - By Darkul
  4. - My Youtube: www.youtube.com/DarkulGaming
  5. - My Krunker modpack: www.krunker.io/social.html?p=mod&q=DarkulYT
  6. - Follow me on Krunker: www.krunker.io/social.html?p=profile&q=DarkulYT
  7. send me some KR if you like the dark theme <3
  8. ***********************************************************************/
  9.  
  10.  
  11. :root {
  12.     --accent-color: #0670c2;
  13.     --health-color: var(--accent-color);
  14.     --ammo-color: #fff;
  15.     --premium-color: #fbc02d;
  16.     --verified-color: #40c4ff;
  17.     --menu-bg-color: rgba(15, 15, 15, .2);
  18.     --menu-bg-color-secondary: rgba(0, 0, 0, .5);
  19.     --ingame-bg-color: rgba(15, 15, 15, .2);
  20.     --text-transform: none;
  21. }
  22.  
  23. #menuPingIcon {
  24.     color: var(--accent-color) !important;
  25. }
  26.  
  27. #menuPingDisplay .material-icons {
  28.     font-size: 16px;
  29. }
  30.  
  31. #pingIcon {
  32.     color: var(--accent-color) !important;
  33. }
  34.  
  35. #pingDisplay .material-icons {
  36.     font-size: 32px;
  37. }
  38.  
  39. #timerDisplay {
  40.     text-align: center;
  41.     position: fixed;
  42.     transform: translateX(-50%);
  43.     top: 80%;
  44.     left: 50%;
  45.     padding: 0;
  46.     padding-left: 0;
  47.     padding-top: 0;
  48.     padding-right: 0;
  49.     padding-bottom: 0;
  50.     margin-left: 0;
  51.     margin-top: 0;
  52.     margin-right: 0;
  53.     margin-bottom: 0;
  54.     border-radius: 0;
  55.     background-color: transparent;
  56.     will-change: unset;
  57. }
  58.  
  59. #timerVal {
  60.     font-size: 36px;
  61.     padding-left: 0;
  62.     text-shadow: 2px 2px 3px rgba(30, 30, 30, .5);
  63.     will-change: unset;
  64.     font-family: 'Tahoma', tahoma;
  65. }
  66.  
  67. #timerIcon {
  68.     display: none;
  69. }
  70.  
  71. #endTimer {
  72.     color: #fff;
  73.     text-shadow: none;
  74.     font-style: normal;
  75. }
  76.  
  77. .countIcon {
  78.     background-color: var(--ingame-bg-color);
  79.     border-radius: 0;
  80.     padding: 7px;
  81. }
  82.  
  83. #deathsVal,
  84. #killsVal,
  85. #livesDisp,
  86. #myScoreVal {
  87.     bottom: 7px;
  88.     position: relative;
  89. }
  90.  
  91. #streakCount {
  92.     position: fixed;
  93.     transform: translateX(-50%);
  94.     top: 85%;
  95.     left: 50%;
  96.     background-color: transparent;
  97.     text-shadow: 2px 2px 3px rgba(30, 30, 30, .5);
  98.     font-family: 'Tahoma', tahoma;
  99. }
  100.  
  101. #streakIcon {
  102.     filter: drop-shadow(2px 2px 3px rgba(30, 30, 30, .5));
  103. }
  104.  
  105. .kfItem {
  106.     border-radius: 0;
  107.     background-color: var(--ingame-bg-color);
  108. }
  109.  
  110. #hudClassIcon {
  111.     display: none;
  112. }
  113.  
  114. #healthValueHolder {
  115.     background-color: transparent;
  116.     width: 100px;
  117.     height: 65px;
  118.     border-radius: 0;
  119.     position: fixed;
  120.     left: 30%;
  121.     bottom: 25%;
  122.     padding: 0;
  123.     margin-bottom: 0;
  124.     padding-right: 0;
  125.     padding-left: 0;
  126.     align-items: center;
  127.     font-family: 'Tahoma', tahoma;
  128. }
  129.  
  130. #healthValue {
  131.     color: var(--health-color);
  132.     font-size: 48px;
  133.     font-weight: 700;
  134.     letter-spacing: 2px;
  135.     text-align: center;
  136.     text-shadow: 2px 2px 3px rgba(30, 30, 30, .5);
  137.     margin-top: 0;
  138.     will-change: unset;
  139.     font-family: 'Tahoma', tahoma;
  140. }
  141.  
  142. #maxHP {
  143.     display: none;
  144. }
  145.  
  146. #challIcon {
  147.     display: none !important;
  148. }
  149.  
  150. #healthBar {
  151.     display: none;
  152. }
  153.  
  154. #ammoDisplay {
  155.     background-color: transparent;
  156.     letter-spacing: 2px;
  157.     width: 100px;
  158.     height: 65px;
  159.     border-radius: 0;
  160.     position: fixed;
  161.     right: 31%;
  162.     bottom: 25%;
  163.     padding: 0;
  164.     padding-top: 0;
  165.     padding-left: 0;
  166.     transform: none;
  167.     font-family: 'Tahoma', tahoma;
  168. }
  169.  
  170. #ammoVal {
  171.     color: var(--ammo-color);
  172.     font-size: 48px;
  173.     font-weight: 700;
  174.     letter-spacing: 2px;
  175.     margin-left: 12px;
  176.     text-shadow: 2px 2px 3px rgba(30, 30, 30, .5);
  177.     font-family: 'Tahoma', tahoma;
  178. }
  179.  
  180. #ammoMax {
  181.     display: none;
  182. }
  183.  
  184. #ammoIcon {
  185.     display: none;
  186. }
  187.  
  188. #killStreakHolder {
  189.     position: fixed;
  190.     left: 53%;
  191.     top: 80%;
  192. }
  193.  
  194. .killStreakItem {
  195.     width: 50px;
  196.     height: 50px;
  197.     background-color: transparent;
  198. }
  199.  
  200. #reloadMsg {
  201.     background: transparent !important;
  202. }
  203.  
  204. #chatInput {
  205.     background-color: var(--ingame-bg-color) !important;
  206.     font-size: 16px;
  207. }
  208.  
  209. #chatInput::placeholder {
  210.     color: rgba(255, 255, 255, .5) !important;
  211.     text-transform: var(--text-transform);
  212. }
  213.  
  214. #chatHolder {
  215.     bottom: 20px !important;
  216.     left: 20px;
  217. }
  218.  
  219. .chatItem {
  220.     border-radius: 0;
  221. }
  222.  
  223. .chatMsg span[style*="color:#9eeb56"] {
  224.     color: var(--accent-color) !important;
  225. }
  226.  
  227. #weapDisplay {
  228.     bottom: 50%;
  229.     transform: translateY(50%);
  230. }
  231.  
  232. #voiceDisplay {
  233.     display: none;
  234. }
  235.  
  236. .readAll {
  237.     background-color: transparent;
  238.     color: var(--accent-color);
  239. }
  240.  
  241. .readAll:hover {
  242.     background-color: transparent;
  243.     color: #fff;
  244. }
  245.  
  246. #aMerger {
  247.     display: none!important;
  248. }
  249.  
  250. #topRight {
  251.     top: 10px;
  252.     right: 15px;
  253. }
  254.  
  255. #deathsVal, #killsVal, #livesDisp, #myScoreVal {
  256.     bottom: 0px;
  257. }
  258.  
  259. #menuClassContainer {
  260.     right: -195px;
  261. }
  262.  
  263. /*
  264. ************************
  265. Dark theme + hidden ads
  266. ************************
  267. */
  268.  
  269. /* Hide ads */
  270. #endAHolderR, #endAHolderL, #watermark {
  271.     display: none!important;
  272. }
  273.  
  274. /* Hide recommended streamers + merch */
  275. #streamContainer, #merchHolder {
  276.     display: none!important;
  277. }
  278.  
  279. /* Bottom menu options row */
  280. #subLogoButtons {
  281.     bottom: 5px;
  282. }
  283.  
  284. /* menu color + shadow */
  285. #menuWindow {
  286.     background-color: #282828!important;
  287.     box-shadow: 0px 7px 3px 0 #141414!important;
  288. }
  289.  
  290. .settingsHeader, .serverHeader {
  291.     background-color: #282828!important;
  292. }
  293.  
  294. /* menu text */
  295. #menuWindow > .setHed {
  296.     color: #aaa!important;
  297. }
  298.  
  299. input:hover + .hostMapImg, input:checked + .hostMapImg {
  300.     transform: scale(1.05);
  301.     filter: saturate(1.5);
  302. }
  303.  
  304. .tabANew {
  305.     cursor: default;
  306.     border-bottom: 5px solid rgba(0,0,0,.7);
  307.     color: white!important;
  308. }
  309.  
  310. .settingTab, .settName, .settNameSmall, .menuTabNew, .mailDate {
  311.     color: #999;
  312. }
  313.  
  314. .setHed, .changeText, .menuSelectorHeader, .plusOrMinus, .menuSelectorHeader > span, .menuSelectorHolder>div,.serverPCount,.serverRegion, #serverSearch, .b, .mapListItem>div *, .smlInput, .accountInput, #mailList>*, #menuWindow > div:nth-child(1), #premTime, #menuWindow>div {
  315.     color: white!important;
  316. }
  317.  
  318. .floatR {
  319.     color: white;
  320. }
  321.  
  322. .buttonG {
  323.     background-color: #2196f3!important;
  324.     box-shadow: inset 0 -7px 0 0 #1d6197!important;
  325. }
  326.  
  327. #menuWindow {
  328.     top: 54%;
  329.     max-height: calc(100% - 380px)!important;
  330. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement