Dark mode themes (CSS)...here you go
Posted: 11 December 2020, 11:42
Hi everyone! I've been working on a set of custom dark mode themes for BGA for awhile and I think they're pretty solid. You're welcome to give them a try. Here's a sample dark mode screenshot from 7 Wonders Duel to give you an idea of what these themes do:
Compatibility
Compatibility with all pages across BGA is my highest priority. I've verified that the themes works for all Premium games, all popular and award-winning games, and dozens more. They also correct a number of CSS issues on the main site and improve the look and feel of many games. If you find any issues, please report them to me here!
Installation
Variant #1: Black dark mode
Installation
* Please note, if you don't see the dark mode theme, try holding the Shift key down and reload the page, or close your browser window and come back. Also note, the stylesheet doesn't fully appear on the forums section of the site.
Variant #2: Blue dark mode
Installation
* Please note, if you don't see the dark mode theme, try holding the Shift key down and reload the page, or close your browser window and come back. Also note, the stylesheet doesn't fully appear on the forums section of the site.
Variant #3: Purple dark mode
Installation
* Please note, if you don't see the dark mode theme, try holding the Shift key down and reload the page, or close your browser window and come back. Also note, the stylesheet doesn't fully appear on the forums section of the site.
Variant #4: Cafe dark mode
Installation
* Please note, if you don't see the dark mode theme, try holding the Shift key down and reload the page, or close your browser window and come back. Also note, the stylesheet doesn't fully appear on the forums section of the site.
Contributed variants
Changes:
12/11/20: Revised chat styles
12/12/20: Fix for post-game header
12/23/20: Five across in the favorites section of the Play Now list
12/28/20: Adjust color of #async_table_banner to match icon; Significant changes to the game lobby page to increase box image size, remove redundant "Play Now!" button, and overall put more focus on the game rather than the chrome.
12/29/20: Make games list page consistent with the look and feel of the lobby page
12/29/20: Publish rebuilt black, blue, purple, and cafe variants
12/29/20: Add fix for Can't Stop dice choices text
12/31/20: Fixes and adjustments for dozens of games and main site issues
- darkmode_sample.jpg (230.6 KiB) Viewed 8937 times
Compatibility
Compatibility with all pages across BGA is my highest priority. I've verified that the themes works for all Premium games, all popular and award-winning games, and dozens more. They also correct a number of CSS issues on the main site and improve the look and feel of many games. If you find any issues, please report them to me here!
Installation
- Choose one of the theme variants below: My "official" #1–#4, or one of the contributed variants
- Follow the listed installation directions
- After installation, navigate to https://boardgamearena.com. Voila!
Variant #1: Black dark mode
- bga_black.jpg (223.97 KiB) Viewed 9007 times
Installation
- Click the "SELECT ALL" link above the CSS code below and then press Crtl+C (Windows) or Cmd+C (Mac).
- Navigate to https://boardgamearena.com/preferences?section=advanced
- Paste the copied CSS from step #1 into the text box there
- Hit the Save button.
- Navigate to https://boardgamearena.com. Voila!*
Code: Select all
#overall-footer::after{font-family:Monaco,monospace;white-space:pre;display:block;padding:1em;color:#999;text-align:center;font-size:8pt;content:"Reminder: You are using custom Dark Mode CSS Version 2.1. Licensed under CC BY-NC-SA 4.0. See https://boardgamearena.com/forum/viewtopic.php?f=3&t=18654 for details."}html{background:radial-gradient(ellipse /**/at /**/top, #555555, #0a0a0a),radial-gradient(ellipse /**/at /**/bottom, #555555, #0a0a0a),url(https://wallpaperaccess.com/full/781329.jpg);background-attachment:fixed;background-position:center}#topbar{background:#222}#async_table_banner{color:#fff;background-color:#e00}#async_table_banner a{color:#0cc}#async_table_banner a:link,#async_table_banner a:visited{color:#0cc}#page-title{background-color:rgba(88,88,88,.75) !important;color:#fff}.current_player_is_active #page-title{background-color:#777}.pageheader{background-color:transparent;color:#fff}.pageheader_menuitembar{border-radius:0 0 6px 6px}.newbgatable th{text-transform:capitalize;color:#fff}.newbgatable td{color:#fff}.whiteblock{background:rgba(255,255,255,.3);background:rgba(0,0,0,.2);color:#fff}.gametable{border:1px #000 solid;background-color:#444;padding-top:10px;padding-bottom:10px}.pagesection{background-color:rgba(64,64,64,.5);color:#fff}#pagesection_about{color:#fff}.pagesection h2,.portlet h2,.pagesection h3,.portlet h3{background:linear-gradient(#888888, #777777);color:#111}a.bgabutton_gray{background-color:#fff}span.bgabutton_gray{background:#bbb}.bgabutton_blue{background:#71b648}.pageheader_menu_verylarge .pageheader_big_switch{background-color:#333;color:#fff}#table_warnings{color:#000}.tabbed_slider_bar_left,.tabbed_slider_bar_right{border-top:28px solid #444}.tabbed_slider_bar_barcenter,#pageheaderlobby{background:#444}.switcher_zone{background:linear-gradient(#333333, #111111);border-left:1px solid #555}.switcher_zone .fa-caret-down{text-shadow:1px 0 1px #777;color:#333}.icon_plus span{top:-3px !important}.statstable th{background-color:#222}.gametable_separator{background-color:#222}.playernotification_not_read{background-color:#edbab7}.dijitInputInner{background-color:#222 !important;color:#fff}.controlpanelmenu .panelmenuicon,.controlpanelmenu .subtitle{color:unset}.dj_webkit .tundra .dijitTooltipContainer{box-shadow:0 5px 10px #111}.dijitPopup>a.bgabutton_gray,.dijitPopup a.bgabutton_gray{color:#111}.dijitTooltipDialogPopup a.bgabutton_gray,.gametable a.bgabutton_gray{border:1px solid #111;color:#111}#welcome-module .post{border-bottom:1px #666 solid}#welcome-module .comment{background-image:none;background-color:rgba(245,245,245,.15);border-radius:6px}#welcome-module .extended_message_hidden:after{left:67px;background:linear-gradient(to /**/bottom, rgba(32, 32, 32, 0), #202020)}#welcome-module .board_fake_input{background-color:#222;border:1px solid #b3b3b3}#gamelist-module select{background-color:#222;color:#fff}#gamelist-module .game_category_more_wrap{display:none}#gamelist-module #col_filter_gamename{margin-right:50px}#gamelist-module .gamelist_item{box-shadow:none;margin-right:30px}#gamelist-module .gamelist_item .game_box_image_wrap{padding:10px;border-radius:8px;border:2px solid #111;background:radial-gradient(ellipse /**/at /**/center, #555/**/ -50%, #191919)}#gamelist-module .gamelist_item .game_box_image_wrap img:hover{transform:scale(1.05)}#gamelist-module .gamelist_item .game_box_image_wrap .emblempremium_big{position:absolute;right:unset;left:-16px}#gamelist-module .gamelist_item{zoom:110%}#gamelist-module .gamelist_itemrow{overflow:visible}#gamelist-module .gamename{font-size:20px;position:relative;left:10px;top:2px;color:#666}.notouch-device #gamelist-module .gamelist_item:hover{background-color:transparent}.notouch-device #gamelist-module a:hover{color:#666;text-decoration:none}.notouch-device #gamelist-module a .gamename:hover{color:#666;text-decoration:underline}#gamepanel-module .icon16_duration{filter:invert(1)}#gamepanel-module .challenge_image{filter:grayscale(1)}#gamelobby-module .pageheader_menu .pageheader_big_switch:hover,#gamelobby-module .pageheader_menu .dropdown_expanded .pageheader_big_switch{background-color:#565656}#gamelobby-module .pageheader_menu .pageheader_big_switch:hover .switcher_zone,#gamelobby-module .pageheader_menu .dropdown_expanded .pageheader_big_switch .switcher_zone{background:linear-gradient(#c2c2c2, #efefef)}#gamelobby-module .pageheader_menu #lobby_friend_list_state>h3{color:#fff}#gamelobby-module .pageheader_menu #lobby_invited_friend_section>h3{color:#fff}#gamelobby-module .pageheader_menu #lobby_invite_more_friend_button .lobby_invite_friend_avatar,#gamelobby-module .pageheader_menu #lobby_add_friend_button .lobby_invite_friend_avatar{background-color:#222}#gamelobby-module .game_box_wrap{margin-right:20px;border:2px solid #111}#gamelobby-module .game_box_wrap.tables_available{border:2px solid #000}#gamelobby-module .game_box_wrap .wannaplay_item{background:radial-gradient(ellipse /**/at /**/center, #555555 /**/ -50%, #191919)}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_mask{left:unset;right:-20px;top:40px}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_mask .wannaplay_mask_button.del_favorite{background-color:#444;border:1px solid #000}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_image_wrap{position:absolute;top:7px;zoom:120%}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename{top:250px}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner{width:90%;text-align:center;left:8px}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner a:link,#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner a:visited{color:#666}#gamelobby-module .game_box_wrap .wannaplay_item .emblempremium_big{position:absolute;right:unset;left:-16px}#gamelobby-module .wannaplayauto_play_zone_content{display:none}#gamelobby-module .wannaplayauto_play_zone_content .wannaplayauto_button{box-shadow:0 5px 10px 0 rgba(0,0,0,.7)}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .game_box_mask{right:-26px}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .wannaplay_gamename{top:145px}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .gamenameinner{width:90%}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .game_box_mask{right:-26px}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .wannaplay_gamename{top:145px}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .gamenameinner{width:90%}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .game_box_image_wrap{top:15px}#gamelobby-module .tiny_verycompactlobby .game_box_wrap .wannaplay_item .game_box_image_wrap{top:2px;left:2px;zoom:unset}#table-module .pageheader{background-color:rgba(0,0,0,.4);color:#fff}#table-module .game_progression_bar{top:inherit;border:1px #999 solid}#table-module .whiteblock{background-image:none;background-color:#444;border-radius:10px}#table-module .active_player_left{border-right:1px #666 solid}#player-module #pagesection_lastresults .post{border-bottom:1px #111 solid}.game_interface #spectatorbox{padding-left:8px}.game_interface #not_playing_help{color:#0cc}.game_interface #logs{overflow:scroll;scrollbar-width:none;-ms-overflow-style:none}.game_interface #logs::-webkit-scrollbar{width:0;height:0}.game_interface #logs .log .roundedbox{background-color:rgba(222,222,222,.65);border-radius:5px}.game_interface #logs .playername[style$='"#3ea7c6;"']{text-shadow:-1px -1px 0 #444,1px -1px 0 #444,-1px 1px 0 #444,1px 1px 0 #444}.game_interface #logs #seemorelogs{background:linear-gradient(0deg, black, transparent)}.game_interface .player-board{background:#eee}.game_interface .player-board.spectator-mode .roundedbox_topleft,.game_interface .player-board.spectator-mode .roundedbox_topmain,.game_interface .player-board.spectator-mode .roundedbox_topright,.game_interface .player-board.spectator-mode .roundedbox_main,.game_interface .player-board.spectator-mode .roundedbox_bottomleft,.game_interface .player-board.spectator-mode .roundedbox_bottommain,.game_interface .player-board.spectator-mode .roundedbox_bottomright{background:unset}.game_interface .player-board.spectator-mode .roundedboxinner{left:5px}.game_interface .player-name>a[style="color: #ffffff"]{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.game_interface #pagemaintitletext>span:first-of-type{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.game_interface #pagemaintitletext>span[style$='"#000000;"']:first-of-type{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777 !important}.game_interface #pagemaintitletext>span[style$='"#008000;"']:first-of-type{text-shadow:-1px -1px 0 #030,1px -1px 0 #030,-1px 1px 0 #030,1px 1px 0 #030 !important}.game_interface #pagemaintitletext>span[style$='"#0000ff;"']:first-of-type{text-shadow:-1px -1px 0 #116,1px -1px 0 #116,-1px 1px 0 #116,1px 1px 0 #116 !important}#community-module .col-md-6 .tips{background-color:#202020}#chatbar .dropshadow{background-image:none}#chatbar .msgtime{position:unset;color:#888}#chatbar .chatwindowexpanded{background-color:#eee}#chatbar .chatwindowcollapsed{border-radius:7px 7px 0 0;box-shadow:0 0 7px 5px rgba(0,0,0,.3);background-color:rgba(255,255,255,.9)}#chatbar .chatwindowcollapsedtitle{top:6px;left:9px}#chatbar .chatwindowlogs{background-color:rgba(0,0,0,.66);box-shadow:0 0 7px 5px rgba(0,0,0,.5)}#chatbar .chatwindowlogs_zone .roundedbox.chatlog .roundedboxinner{background-color:rgba(255,255,255,.7);color:#000}#chatbar .chatwindowlogs_zone .roundedbox.chatlog.ownchatlog .roundedboxinner{background-color:rgba(100,100,100,.7);color:#fff}.cantstop_asmodee #dicechoices{color:wheat}#coloretto_wrapper #round_status{color:#fff}#coloretto_wrapper #deck_count{color:#fff}#game_play_area .lettertycoon_area{background-color:rgba(255,255,255,.2);border:none;color:#fff}#game_play_area .lettertycoon_area_label{color:#fff}#game_play_area .lettertycoon_deck_info{color:#fff}#playArea #down #decksizetext{color:#fff}#play-area #cards #cutCardSpace{color:#fff}#decks_and_available_achievements{color:#fff}#sevenwonder_wrap #card_rotation_wrap{color:#fff}#sevenwonder_wrap #card_rotation_wrap #handrotation{filter:invert(1)}#game_play_area_wrap #discard_count{color:#fff}#game_play_area_wrap #trees h3{color:#fff}#hanabi_prefs_button{background-color:#ccc}#betpanel+h3{color:#fff}#myhand+h3{color:#fff}#card_played{color:#fff}#gosu_wrapper h3{color:#fff}.xdu_notifTop{color:#fff}#recruitment{color:#fff}br.clear+h3{color:#fff}#deck_wrap{color:#fff}#table_setup{color:#fff}#flt_counters{color:#fff}#kahuna_right_pane{color:#fff}#krosmaster_interface #master_list .master{-webkit-box-shadow:4px 4px 37px 0 #000;-moz-box-shadow:4px 4px 37px 0 #000;box-shadow:4px 4px 37px 0 #000}#krosmaster_interface .playerstock{background:rgba(255,255,255,.2)}#krosmaster_interface .playerstock h2{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#krosmaster_interface .playerstock h2[style$='"#6f1e6b"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#hints_wrap h3{color:#fff}#hints_wrap #deck{border-color:#999}#swd_wrap .player_area_name h3,#swd_wrap .end_game_player_name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#swd_wrap .progress_token_outline{border:1px solid #111;background:rgba(0,0,0,.2)}#pr_game_area .tiles_label{color:#fff}#pr_game_area #plantations,#pr_game_area #buildings{background:rgba(0,0,0,.2)}#thething .player_view,#thething .info{color:#fff;background:rgba(0,0,0,.1)}#sa_main #diceboard{background:rgba(0,0,0,.2);color:#fff;border:2px solid #111}#welcometo-container #plan-cards-container,#welcometo-container #construction-cards-container{background-color:rgba(128,128,128,.2)}#sushigo_wrapper #deck_container h3{color:#fff}#sushigo_wrapper .block_title{background-image:linear-gradient(180deg, rgba(77, 77, 77, 0.75), rgba(26, 26, 26, 0.75))}#zoomBox #characterSelectionDescription{background:rgba(0,0,0,.3) !important}#cards_title #torpedocards_title,#cards_title #playerhand_title{color:#fff}#coc_game #players-zone h3 span[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777 !important}#lostcities_wrapper #round_count,#lostcities_wrapper #deck_count{color:#fff !important}#game_play_area_wrap #player_bid_zone .player_bid_zone span[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#hud{box-shadow:inset 0 0 10px rgba(17,17,17,.67)}#hud+.play_grids .play_grid{box-shadow:inset 0 0 10px rgba(17,17,17,.67)}#hud+.play_grids .play_grid .player_name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000 !important}#bsk{color:#fff}#turn-container #nb-turns-container{color:#fff}#thurntaxis_board #carriages,#thurntaxis_board .gameAreaContainer{border:rgba(100,100,100,.5)}#thurntaxis_board #carriages h3,#thurntaxis_board .gameAreaContainer h3{color:#fff}#player_table h3[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#market_map+#playerareas .playerArea .player-name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#market_map+#playerareas .playerArea .player-name[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}.coord_label.luis{color:#fff}/*# sourceMappingURL=darkmode.css.map */
Variant #2: Blue dark mode
- bga_blue.jpg (224.03 KiB) Viewed 9007 times
Installation
- Click the "SELECT ALL" link above the CSS code below and then press Crtl+C (Windows) or Cmd+C (Mac).
- Navigate to https://boardgamearena.com/preferences?section=advanced
- Paste the copied CSS from step #1 into the text box there
- Hit the Save button.
- Navigate to https://boardgamearena.com. Voila!*
Code: Select all
#overall-footer::after{font-family:Monaco,monospace;white-space:pre;display:block;padding:1em;color:#999;text-align:center;font-size:8pt;content:"Reminder: You are using custom Dark Mode CSS Version 2.1. Licensed under CC BY-NC-SA 4.0. See https://boardgamearena.com/forum/viewtopic.php?f=3&t=18654 for details."}html{background:radial-gradient(ellipse /**/at /**/top, #555566, #0a0a1b),radial-gradient(ellipse /**/at /**/bottom, #555566, #0a0a1b),url(https://wallpaperaccess.com/full/781329.jpg);background-attachment:fixed;background-position:center}#topbar{background:#223}#async_table_banner{color:#fff;background-color:#e00}#async_table_banner a{color:#0cc}#async_table_banner a:link,#async_table_banner a:visited{color:#0cc}#page-title{background-color:rgba(88,88,105,.75) !important;color:#fff}.current_player_is_active #page-title{background-color:#778}.pageheader{background-color:transparent;color:#fff}.pageheader_menuitembar{border-radius:0 0 6px 6px}.newbgatable th{text-transform:capitalize;color:#fff}.newbgatable td{color:#fff}.whiteblock{background:rgba(255,255,255,.3);background:rgba(0,0,0,.2);color:#fff}.gametable{border:1px #001 solid;background-color:#445;padding-top:10px;padding-bottom:10px}.pagesection{background-color:rgba(64,64,81,.5);color:#fff}#pagesection_about{color:#fff}.pagesection h2,.portlet h2,.pagesection h3,.portlet h3{background:linear-gradient(#888899, #777788);color:#112}a.bgabutton_gray{background-color:#fff}span.bgabutton_gray{background:#bbc}.bgabutton_blue{background:#71b648}.pageheader_menu_verylarge .pageheader_big_switch{background-color:#334;color:#fff}#table_warnings{color:#000}.tabbed_slider_bar_left,.tabbed_slider_bar_right{border-top:28px solid #445}.tabbed_slider_bar_barcenter,#pageheaderlobby{background:#445}.switcher_zone{background:linear-gradient(#333344, #111122);border-left:1px solid #556}.switcher_zone .fa-caret-down{text-shadow:1px 0 1px #778;color:#333}.icon_plus span{top:-3px !important}.statstable th{background-color:#223}.gametable_separator{background-color:#223}.playernotification_not_read{background-color:#edbab7}.dijitInputInner{background-color:#223 !important;color:#fff}.controlpanelmenu .panelmenuicon,.controlpanelmenu .subtitle{color:unset}.dj_webkit .tundra .dijitTooltipContainer{box-shadow:0 5px 10px #112}.dijitPopup>a.bgabutton_gray,.dijitPopup a.bgabutton_gray{color:#112}.dijitTooltipDialogPopup a.bgabutton_gray,.gametable a.bgabutton_gray{border:1px solid #112;color:#112}#welcome-module .post{border-bottom:1px #667 solid}#welcome-module .comment{background-image:none;background-color:rgba(245,245,255,.15);border-radius:6px}#welcome-module .extended_message_hidden:after{left:67px;background:linear-gradient(to /**/bottom, rgba(32, 32, 49, 0), #202031)}#welcome-module .board_fake_input{background-color:#223;border:1px solid #b3b3c4}#gamelist-module select{background-color:#223;color:#fff}#gamelist-module .game_category_more_wrap{display:none}#gamelist-module #col_filter_gamename{margin-right:50px}#gamelist-module .gamelist_item{box-shadow:none;margin-right:30px}#gamelist-module .gamelist_item .game_box_image_wrap{padding:10px;border-radius:8px;border:2px solid #112;background:radial-gradient(ellipse /**/at /**/center, #555/**/ -50%, #19192a)}#gamelist-module .gamelist_item .game_box_image_wrap img:hover{transform:scale(1.05)}#gamelist-module .gamelist_item .game_box_image_wrap .emblempremium_big{position:absolute;right:unset;left:-16px}#gamelist-module .gamelist_item{zoom:110%}#gamelist-module .gamelist_itemrow{overflow:visible}#gamelist-module .gamename{font-size:20px;position:relative;left:10px;top:2px;color:#667}.notouch-device #gamelist-module .gamelist_item:hover{background-color:transparent}.notouch-device #gamelist-module a:hover{color:#667;text-decoration:none}.notouch-device #gamelist-module a .gamename:hover{color:#667;text-decoration:underline}#gamepanel-module .icon16_duration{filter:invert(1)}#gamepanel-module .challenge_image{filter:grayscale(1)}#gamelobby-module .pageheader_menu .pageheader_big_switch:hover,#gamelobby-module .pageheader_menu .dropdown_expanded .pageheader_big_switch{background-color:#565656}#gamelobby-module .pageheader_menu .pageheader_big_switch:hover .switcher_zone,#gamelobby-module .pageheader_menu .dropdown_expanded .pageheader_big_switch .switcher_zone{background:linear-gradient(#c2c2d3, #efefff)}#gamelobby-module .pageheader_menu #lobby_friend_list_state>h3{color:#fff}#gamelobby-module .pageheader_menu #lobby_invited_friend_section>h3{color:#fff}#gamelobby-module .pageheader_menu #lobby_invite_more_friend_button .lobby_invite_friend_avatar,#gamelobby-module .pageheader_menu #lobby_add_friend_button .lobby_invite_friend_avatar{background-color:#223}#gamelobby-module .game_box_wrap{margin-right:20px;border:2px solid #112}#gamelobby-module .game_box_wrap.tables_available{border:2px solid #001}#gamelobby-module .game_box_wrap .wannaplay_item{background:radial-gradient(ellipse /**/at /**/center, #555566 /**/ -50%, #19192a)}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_mask{left:unset;right:-20px;top:40px}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_mask .wannaplay_mask_button.del_favorite{background-color:#445;border:1px solid #001}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_image_wrap{position:absolute;top:7px;zoom:120%}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename{top:250px}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner{width:90%;text-align:center;left:8px}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner a:link,#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner a:visited{color:#667}#gamelobby-module .game_box_wrap .wannaplay_item .emblempremium_big{position:absolute;right:unset;left:-16px}#gamelobby-module .wannaplayauto_play_zone_content{display:none}#gamelobby-module .wannaplayauto_play_zone_content .wannaplayauto_button{box-shadow:0 5px 10px 0 rgba(0,0,17,.7)}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .game_box_mask{right:-26px}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .wannaplay_gamename{top:145px}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .gamenameinner{width:90%}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .game_box_mask{right:-26px}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .wannaplay_gamename{top:145px}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .gamenameinner{width:90%}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .game_box_image_wrap{top:15px}#gamelobby-module .tiny_verycompactlobby .game_box_wrap .wannaplay_item .game_box_image_wrap{top:2px;left:2px;zoom:unset}#table-module .pageheader{background-color:rgba(0,0,17,.4);color:#fff}#table-module .game_progression_bar{top:inherit;border:1px #99a solid}#table-module .whiteblock{background-image:none;background-color:#445;border-radius:10px}#table-module .active_player_left{border-right:1px #667 solid}#player-module #pagesection_lastresults .post{border-bottom:1px #111 solid}.game_interface #spectatorbox{padding-left:8px}.game_interface #not_playing_help{color:#0cc}.game_interface #logs{overflow:scroll;scrollbar-width:none;-ms-overflow-style:none}.game_interface #logs::-webkit-scrollbar{width:0;height:0}.game_interface #logs .log .roundedbox{background-color:rgba(222,222,239,.65);border-radius:5px}.game_interface #logs .playername[style$='"#3ea7c6;"']{text-shadow:-1px -1px 0 #444,1px -1px 0 #444,-1px 1px 0 #444,1px 1px 0 #444}.game_interface #logs #seemorelogs{background:linear-gradient(0deg, black, transparent)}.game_interface .player-board{background:#eee}.game_interface .player-board.spectator-mode .roundedbox_topleft,.game_interface .player-board.spectator-mode .roundedbox_topmain,.game_interface .player-board.spectator-mode .roundedbox_topright,.game_interface .player-board.spectator-mode .roundedbox_main,.game_interface .player-board.spectator-mode .roundedbox_bottomleft,.game_interface .player-board.spectator-mode .roundedbox_bottommain,.game_interface .player-board.spectator-mode .roundedbox_bottomright{background:unset}.game_interface .player-board.spectator-mode .roundedboxinner{left:5px}.game_interface .player-name>a[style="color: #ffffff"]{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.game_interface #pagemaintitletext>span:first-of-type{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.game_interface #pagemaintitletext>span[style$='"#000000;"']:first-of-type{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777 !important}.game_interface #pagemaintitletext>span[style$='"#008000;"']:first-of-type{text-shadow:-1px -1px 0 #030,1px -1px 0 #030,-1px 1px 0 #030,1px 1px 0 #030 !important}.game_interface #pagemaintitletext>span[style$='"#0000ff;"']:first-of-type{text-shadow:-1px -1px 0 #116,1px -1px 0 #116,-1px 1px 0 #116,1px 1px 0 #116 !important}#community-module .col-md-6 .tips{background-color:#202031}#chatbar .dropshadow{background-image:none}#chatbar .msgtime{position:unset;color:#889}#chatbar .chatwindowexpanded{background-color:#eef}#chatbar .chatwindowcollapsed{border-radius:7px 7px 0 0;box-shadow:0 0 7px 5px rgba(0,0,17,.3);background-color:rgba(255,255,255,.9)}#chatbar .chatwindowcollapsedtitle{top:6px;left:9px}#chatbar .chatwindowlogs{background-color:rgba(0,0,17,.66);box-shadow:0 0 7px 5px rgba(0,0,17,.5)}#chatbar .chatwindowlogs_zone .roundedbox.chatlog .roundedboxinner{background-color:rgba(255,255,255,.7);color:#001}#chatbar .chatwindowlogs_zone .roundedbox.chatlog.ownchatlog .roundedboxinner{background-color:rgba(100,100,117,.7);color:#fff}.cantstop_asmodee #dicechoices{color:wheat}#coloretto_wrapper #round_status{color:#fff}#coloretto_wrapper #deck_count{color:#fff}#game_play_area .lettertycoon_area{background-color:rgba(255,255,255,.2);border:none;color:#fff}#game_play_area .lettertycoon_area_label{color:#fff}#game_play_area .lettertycoon_deck_info{color:#fff}#playArea #down #decksizetext{color:#fff}#play-area #cards #cutCardSpace{color:#fff}#decks_and_available_achievements{color:#fff}#sevenwonder_wrap #card_rotation_wrap{color:#fff}#sevenwonder_wrap #card_rotation_wrap #handrotation{filter:invert(1)}#game_play_area_wrap #discard_count{color:#fff}#game_play_area_wrap #trees h3{color:#fff}#hanabi_prefs_button{background-color:#ccd}#betpanel+h3{color:#fff}#myhand+h3{color:#fff}#card_played{color:#fff}#gosu_wrapper h3{color:#fff}.xdu_notifTop{color:#fff}#recruitment{color:#fff}br.clear+h3{color:#fff}#deck_wrap{color:#fff}#table_setup{color:#fff}#flt_counters{color:#fff}#kahuna_right_pane{color:#fff}#krosmaster_interface #master_list .master{-webkit-box-shadow:4px 4px 37px 0 #000;-moz-box-shadow:4px 4px 37px 0 #000;box-shadow:4px 4px 37px 0 #000}#krosmaster_interface .playerstock{background:rgba(255,255,255,.2)}#krosmaster_interface .playerstock h2{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#krosmaster_interface .playerstock h2[style$='"#6f1e6b"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#hints_wrap h3{color:#fff}#hints_wrap #deck{border-color:#99a}#swd_wrap .player_area_name h3,#swd_wrap .end_game_player_name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#swd_wrap .progress_token_outline{border:1px solid #111;background:rgba(0,0,0,.2)}#pr_game_area .tiles_label{color:#fff}#pr_game_area #plantations,#pr_game_area #buildings{background:rgba(0,0,17,.2)}#thething .player_view,#thething .info{color:#fff;background:rgba(0,0,17,.1)}#sa_main #diceboard{background:rgba(0,0,0,.2);color:#fff;border:2px solid #111}#welcometo-container #plan-cards-container,#welcometo-container #construction-cards-container{background-color:rgba(128,128,145,.2)}#sushigo_wrapper #deck_container h3{color:#fff}#sushigo_wrapper .block_title{background-image:linear-gradient(180deg, rgba(77, 77, 77, 0.75), rgba(26, 26, 26, 0.75))}#zoomBox #characterSelectionDescription{background:rgba(0,0,0,.3) !important}#cards_title #torpedocards_title,#cards_title #playerhand_title{color:#fff}#coc_game #players-zone h3 span[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777 !important}#lostcities_wrapper #round_count,#lostcities_wrapper #deck_count{color:#fff !important}#game_play_area_wrap #player_bid_zone .player_bid_zone span[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#hud{box-shadow:inset 0 0 10px rgba(17,17,34,.67)}#hud+.play_grids .play_grid{box-shadow:inset 0 0 10px rgba(17,17,34,.67)}#hud+.play_grids .play_grid .player_name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000 !important}#bsk{color:#fff}#turn-container #nb-turns-container{color:#fff}#thurntaxis_board #carriages,#thurntaxis_board .gameAreaContainer{border:rgba(100,100,117,.5)}#thurntaxis_board #carriages h3,#thurntaxis_board .gameAreaContainer h3{color:#fff}#player_table h3[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#market_map+#playerareas .playerArea .player-name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#market_map+#playerareas .playerArea .player-name[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}.coord_label.luis{color:#fff}/*# sourceMappingURL=darkmode-blue.css.map */
Variant #3: Purple dark mode
- bga_purple.jpg (224.62 KiB) Viewed 9005 times
Installation
- Click the "SELECT ALL" link above the CSS code below and then press Crtl+C (Windows) or Cmd+C (Mac).
- Navigate to https://boardgamearena.com/preferences?section=advanced
- Paste the copied CSS from step #1 into the text box there
- Hit the Save button.
- Navigate to https://boardgamearena.com. Voila!*
Code: Select all
#overall-footer::after{font-family:Monaco,monospace;white-space:pre;display:block;padding:1em;color:#999;text-align:center;font-size:8pt;content:"Reminder: You are using custom Dark Mode CSS Version 2.1. Licensed under CC BY-NC-SA 4.0. See https://boardgamearena.com/forum/viewtopic.php?f=3&t=18654 for details."}html{background:radial-gradient(ellipse /**/at /**/top, #664466, #1b001b),radial-gradient(ellipse /**/at /**/bottom, #664466, #1b001b),url(https://wallpaperaccess.com/full/781329.jpg);background-attachment:fixed;background-position:center}#topbar{background:#313}#async_table_banner{color:#fff;background-color:#e00}#async_table_banner a{color:#0cc}#async_table_banner a:link,#async_table_banner a:visited{color:#0cc}#page-title{background-color:rgba(105,71,105,.75) !important;color:#fff}.current_player_is_active #page-title{background-color:#868}.pageheader{background-color:transparent;color:#fff}.pageheader_menuitembar{border-radius:0 0 6px 6px}.newbgatable th{text-transform:capitalize;color:#fff}.newbgatable td{color:#fff}.whiteblock{background:rgba(255,255,255,.3);background:rgba(0,0,0,.2);color:#fff}.gametable{border:1px #101 solid;background-color:#535;padding-top:10px;padding-bottom:10px}.pagesection{background-color:rgba(81,47,81,.5);color:#fff}#pagesection_about{color:#fff}.pagesection h2,.portlet h2,.pagesection h3,.portlet h3{background:linear-gradient(#997799, #886688);color:#202}a.bgabutton_gray{background-color:#fff}span.bgabutton_gray{background:#cac}.bgabutton_blue{background:#71b648}.pageheader_menu_verylarge .pageheader_big_switch{background-color:#424;color:#fff}#table_warnings{color:#000}.tabbed_slider_bar_left,.tabbed_slider_bar_right{border-top:28px solid #535}.tabbed_slider_bar_barcenter,#pageheaderlobby{background:#535}.switcher_zone{background:linear-gradient(#442244, #220022);border-left:1px solid #646}.switcher_zone .fa-caret-down{text-shadow:1px 0 1px #868;color:#333}.icon_plus span{top:-3px !important}.statstable th{background-color:#313}.gametable_separator{background-color:#313}.playernotification_not_read{background-color:#edbab7}.dijitInputInner{background-color:#313 !important;color:#fff}.controlpanelmenu .panelmenuicon,.controlpanelmenu .subtitle{color:unset}.dj_webkit .tundra .dijitTooltipContainer{box-shadow:0 5px 10px #202}.dijitPopup>a.bgabutton_gray,.dijitPopup a.bgabutton_gray{color:#202}.dijitTooltipDialogPopup a.bgabutton_gray,.gametable a.bgabutton_gray{border:1px solid #202;color:#202}#welcome-module .post{border-bottom:1px #757 solid}#welcome-module .comment{background-image:none;background-color:rgba(255,228,255,.15);border-radius:6px}#welcome-module .extended_message_hidden:after{left:67px;background:linear-gradient(to /**/bottom, rgba(49, 15, 49, 0), #310f31)}#welcome-module .board_fake_input{background-color:#313;border:1px solid #c4a2c4}#gamelist-module select{background-color:#313;color:#fff}#gamelist-module .game_category_more_wrap{display:none}#gamelist-module #col_filter_gamename{margin-right:50px}#gamelist-module .gamelist_item{box-shadow:none;margin-right:30px}#gamelist-module .gamelist_item .game_box_image_wrap{padding:10px;border-radius:8px;border:2px solid #202;background:radial-gradient(ellipse /**/at /**/center, #555/**/ -50%, #2a082a)}#gamelist-module .gamelist_item .game_box_image_wrap img:hover{transform:scale(1.05)}#gamelist-module .gamelist_item .game_box_image_wrap .emblempremium_big{position:absolute;right:unset;left:-16px}#gamelist-module .gamelist_item{zoom:110%}#gamelist-module .gamelist_itemrow{overflow:visible}#gamelist-module .gamename{font-size:20px;position:relative;left:10px;top:2px;color:#757}.notouch-device #gamelist-module .gamelist_item:hover{background-color:transparent}.notouch-device #gamelist-module a:hover{color:#757;text-decoration:none}.notouch-device #gamelist-module a .gamename:hover{color:#757;text-decoration:underline}#gamepanel-module .icon16_duration{filter:invert(1)}#gamepanel-module .challenge_image{filter:grayscale(1)}#gamelobby-module .pageheader_menu .pageheader_big_switch:hover,#gamelobby-module .pageheader_menu .dropdown_expanded .pageheader_big_switch{background-color:#565656}#gamelobby-module .pageheader_menu .pageheader_big_switch:hover .switcher_zone,#gamelobby-module .pageheader_menu .dropdown_expanded .pageheader_big_switch .switcher_zone{background:linear-gradient(#d3b1d3, #ffdeff)}#gamelobby-module .pageheader_menu #lobby_friend_list_state>h3{color:#fff}#gamelobby-module .pageheader_menu #lobby_invited_friend_section>h3{color:#fff}#gamelobby-module .pageheader_menu #lobby_invite_more_friend_button .lobby_invite_friend_avatar,#gamelobby-module .pageheader_menu #lobby_add_friend_button .lobby_invite_friend_avatar{background-color:#313}#gamelobby-module .game_box_wrap{margin-right:20px;border:2px solid #202}#gamelobby-module .game_box_wrap.tables_available{border:2px solid #101}#gamelobby-module .game_box_wrap .wannaplay_item{background:radial-gradient(ellipse /**/at /**/center, #664466 /**/ -50%, #2a082a)}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_mask{left:unset;right:-20px;top:40px}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_mask .wannaplay_mask_button.del_favorite{background-color:#535;border:1px solid #101}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_image_wrap{position:absolute;top:7px;zoom:120%}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename{top:250px}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner{width:90%;text-align:center;left:8px}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner a:link,#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner a:visited{color:#757}#gamelobby-module .game_box_wrap .wannaplay_item .emblempremium_big{position:absolute;right:unset;left:-16px}#gamelobby-module .wannaplayauto_play_zone_content{display:none}#gamelobby-module .wannaplayauto_play_zone_content .wannaplayauto_button{box-shadow:0 5px 10px 0 rgba(17,0,17,.7)}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .game_box_mask{right:-26px}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .wannaplay_gamename{top:145px}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .gamenameinner{width:90%}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .game_box_mask{right:-26px}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .wannaplay_gamename{top:145px}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .gamenameinner{width:90%}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .game_box_image_wrap{top:15px}#gamelobby-module .tiny_verycompactlobby .game_box_wrap .wannaplay_item .game_box_image_wrap{top:2px;left:2px;zoom:unset}#table-module .pageheader{background-color:rgba(17,0,17,.4);color:#fff}#table-module .game_progression_bar{top:inherit;border:1px #a8a solid}#table-module .whiteblock{background-image:none;background-color:#535;border-radius:10px}#table-module .active_player_left{border-right:1px #757 solid}#player-module #pagesection_lastresults .post{border-bottom:1px #111 solid}.game_interface #spectatorbox{padding-left:8px}.game_interface #not_playing_help{color:#0cc}.game_interface #logs{overflow:scroll;scrollbar-width:none;-ms-overflow-style:none}.game_interface #logs::-webkit-scrollbar{width:0;height:0}.game_interface #logs .log .roundedbox{background-color:rgba(239,205,239,.65);border-radius:5px}.game_interface #logs .playername[style$='"#3ea7c6;"']{text-shadow:-1px -1px 0 #444,1px -1px 0 #444,-1px 1px 0 #444,1px 1px 0 #444}.game_interface #logs #seemorelogs{background:linear-gradient(0deg, black, transparent)}.game_interface .player-board{background:#eee}.game_interface .player-board.spectator-mode .roundedbox_topleft,.game_interface .player-board.spectator-mode .roundedbox_topmain,.game_interface .player-board.spectator-mode .roundedbox_topright,.game_interface .player-board.spectator-mode .roundedbox_main,.game_interface .player-board.spectator-mode .roundedbox_bottomleft,.game_interface .player-board.spectator-mode .roundedbox_bottommain,.game_interface .player-board.spectator-mode .roundedbox_bottomright{background:unset}.game_interface .player-board.spectator-mode .roundedboxinner{left:5px}.game_interface .player-name>a[style="color: #ffffff"]{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.game_interface #pagemaintitletext>span:first-of-type{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.game_interface #pagemaintitletext>span[style$='"#000000;"']:first-of-type{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777 !important}.game_interface #pagemaintitletext>span[style$='"#008000;"']:first-of-type{text-shadow:-1px -1px 0 #030,1px -1px 0 #030,-1px 1px 0 #030,1px 1px 0 #030 !important}.game_interface #pagemaintitletext>span[style$='"#0000ff;"']:first-of-type{text-shadow:-1px -1px 0 #116,1px -1px 0 #116,-1px 1px 0 #116,1px 1px 0 #116 !important}#community-module .col-md-6 .tips{background-color:#310f31}#chatbar .dropshadow{background-image:none}#chatbar .msgtime{position:unset;color:#979}#chatbar .chatwindowexpanded{background-color:#fdf}#chatbar .chatwindowcollapsed{border-radius:7px 7px 0 0;box-shadow:0 0 7px 5px rgba(17,0,17,.3);background-color:rgba(255,238,255,.9)}#chatbar .chatwindowcollapsedtitle{top:6px;left:9px}#chatbar .chatwindowlogs{background-color:rgba(17,0,17,.66);box-shadow:0 0 7px 5px rgba(17,0,17,.5)}#chatbar .chatwindowlogs_zone .roundedbox.chatlog .roundedboxinner{background-color:rgba(255,238,255,.7);color:#101}#chatbar .chatwindowlogs_zone .roundedbox.chatlog.ownchatlog .roundedboxinner{background-color:rgba(117,83,117,.7);color:#fff}.cantstop_asmodee #dicechoices{color:wheat}#coloretto_wrapper #round_status{color:#fff}#coloretto_wrapper #deck_count{color:#fff}#game_play_area .lettertycoon_area{background-color:rgba(255,255,255,.2);border:none;color:#fff}#game_play_area .lettertycoon_area_label{color:#fff}#game_play_area .lettertycoon_deck_info{color:#fff}#playArea #down #decksizetext{color:#fff}#play-area #cards #cutCardSpace{color:#fff}#decks_and_available_achievements{color:#fff}#sevenwonder_wrap #card_rotation_wrap{color:#fff}#sevenwonder_wrap #card_rotation_wrap #handrotation{filter:invert(1)}#game_play_area_wrap #discard_count{color:#fff}#game_play_area_wrap #trees h3{color:#fff}#hanabi_prefs_button{background-color:#dbd}#betpanel+h3{color:#fff}#myhand+h3{color:#fff}#card_played{color:#fff}#gosu_wrapper h3{color:#fff}.xdu_notifTop{color:#fff}#recruitment{color:#fff}br.clear+h3{color:#fff}#deck_wrap{color:#fff}#table_setup{color:#fff}#flt_counters{color:#fff}#kahuna_right_pane{color:#fff}#krosmaster_interface #master_list .master{-webkit-box-shadow:4px 4px 37px 0 #000;-moz-box-shadow:4px 4px 37px 0 #000;box-shadow:4px 4px 37px 0 #000}#krosmaster_interface .playerstock{background:rgba(255,255,255,.2)}#krosmaster_interface .playerstock h2{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#krosmaster_interface .playerstock h2[style$='"#6f1e6b"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#hints_wrap h3{color:#fff}#hints_wrap #deck{border-color:#a8a}#swd_wrap .player_area_name h3,#swd_wrap .end_game_player_name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#swd_wrap .progress_token_outline{border:1px solid #111;background:rgba(0,0,0,.2)}#pr_game_area .tiles_label{color:#fff}#pr_game_area #plantations,#pr_game_area #buildings{background:rgba(17,0,17,.2)}#thething .player_view,#thething .info{color:#fff;background:rgba(17,0,17,.1)}#sa_main #diceboard{background:rgba(0,0,0,.2);color:#fff;border:2px solid #111}#welcometo-container #plan-cards-container,#welcometo-container #construction-cards-container{background-color:rgba(145,111,145,.2)}#sushigo_wrapper #deck_container h3{color:#fff}#sushigo_wrapper .block_title{background-image:linear-gradient(180deg, rgba(77, 77, 77, 0.75), rgba(26, 26, 26, 0.75))}#zoomBox #characterSelectionDescription{background:rgba(0,0,0,.3) !important}#cards_title #torpedocards_title,#cards_title #playerhand_title{color:#fff}#coc_game #players-zone h3 span[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777 !important}#lostcities_wrapper #round_count,#lostcities_wrapper #deck_count{color:#fff !important}#game_play_area_wrap #player_bid_zone .player_bid_zone span[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#hud{box-shadow:inset 0 0 10px rgba(34,0,34,.67)}#hud+.play_grids .play_grid{box-shadow:inset 0 0 10px rgba(34,0,34,.67)}#hud+.play_grids .play_grid .player_name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000 !important}#bsk{color:#fff}#turn-container #nb-turns-container{color:#fff}#thurntaxis_board #carriages,#thurntaxis_board .gameAreaContainer{border:rgba(117,83,117,.5)}#thurntaxis_board #carriages h3,#thurntaxis_board .gameAreaContainer h3{color:#fff}#player_table h3[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#market_map+#playerareas .playerArea .player-name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#market_map+#playerareas .playerArea .player-name[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}.coord_label.luis{color:#fff}/*# sourceMappingURL=darkmode-purple.css.map */
Variant #4: Cafe dark mode
- bga_cafe.jpg (238.42 KiB) Viewed 9007 times
Installation
- Click the "SELECT ALL" link above the CSS code below and then press Crtl+C (Windows) or Cmd+C (Mac).
- Navigate to https://boardgamearena.com/preferences?section=advanced
- Paste the copied CSS from step #1 into the text box there
- Hit the Save button.
- Navigate to https://boardgamearena.com. Voila!*
Code: Select all
#overall-footer::after{font-family:Monaco,monospace;white-space:pre;display:block;padding:1em;color:#999;text-align:center;font-size:8pt;content:"Reminder: You are using custom Dark Mode CSS Version 2.1. Licensed under CC BY-NC-SA 4.0. See https://boardgamearena.com/forum/viewtopic.php?f=3&t=18654 for details."}html{background:radial-gradient(ellipse /**/at /**/top, #665544, #1b0a00),radial-gradient(ellipse /**/at /**/bottom, #665544, #1b0a00),url(https://wallpaperaccess.com/full/781329.jpg);background-attachment:fixed;background-position:center}#topbar{background:#321}#async_table_banner{color:#fff;background-color:#e00}#async_table_banner a{color:#0cc}#async_table_banner a:link,#async_table_banner a:visited{color:#0cc}#page-title{background-color:rgba(105,88,71,.75) !important;color:#fff}.current_player_is_active #page-title{background-color:#876}.pageheader{background-color:transparent;color:#fff}.pageheader_menuitembar{border-radius:0 0 6px 6px}.newbgatable th{text-transform:capitalize;color:#fff}.newbgatable td{color:#fff}.whiteblock{background:rgba(255,255,255,.3);background:rgba(0,0,0,.2);color:#fff}.gametable{border:1px #100 solid;background-color:#543;padding-top:10px;padding-bottom:10px}.pagesection{background-color:rgba(81,64,47,.5);color:#fff}#pagesection_about{color:#fff}.pagesection h2,.portlet h2,.pagesection h3,.portlet h3{background:linear-gradient(#998877, #887766);color:#210}a.bgabutton_gray{background-color:#fff}span.bgabutton_gray{background:#cba}.bgabutton_blue{background:#71b648}.pageheader_menu_verylarge .pageheader_big_switch{background-color:#432;color:#fff}#table_warnings{color:#000}.tabbed_slider_bar_left,.tabbed_slider_bar_right{border-top:28px solid #543}.tabbed_slider_bar_barcenter,#pageheaderlobby{background:#543}.switcher_zone{background:linear-gradient(#443322, #221100);border-left:1px solid #654}.switcher_zone .fa-caret-down{text-shadow:1px 0 1px #876;color:#333}.icon_plus span{top:-3px !important}.statstable th{background-color:#321}.gametable_separator{background-color:#321}.playernotification_not_read{background-color:#edbab7}.dijitInputInner{background-color:#321 !important;color:#fff}.controlpanelmenu .panelmenuicon,.controlpanelmenu .subtitle{color:unset}.dj_webkit .tundra .dijitTooltipContainer{box-shadow:0 5px 10px #210}.dijitPopup>a.bgabutton_gray,.dijitPopup a.bgabutton_gray{color:#210}.dijitTooltipDialogPopup a.bgabutton_gray,.gametable a.bgabutton_gray{border:1px solid #210;color:#210}#welcome-module .post{border-bottom:1px #765 solid}#welcome-module .comment{background-image:none;background-color:rgba(255,245,228,.15);border-radius:6px}#welcome-module .extended_message_hidden:after{left:67px;background:linear-gradient(to /**/bottom, rgba(49, 32, 15, 0), #31200f)}#welcome-module .board_fake_input{background-color:#321;border:1px solid #c4b3a2}#gamelist-module select{background-color:#321;color:#fff}#gamelist-module .game_category_more_wrap{display:none}#gamelist-module #col_filter_gamename{margin-right:50px}#gamelist-module .gamelist_item{box-shadow:none;margin-right:30px}#gamelist-module .gamelist_item .game_box_image_wrap{padding:10px;border-radius:8px;border:2px solid #210;background:radial-gradient(ellipse /**/at /**/center, #555/**/ -50%, #2a1908)}#gamelist-module .gamelist_item .game_box_image_wrap img:hover{transform:scale(1.05)}#gamelist-module .gamelist_item .game_box_image_wrap .emblempremium_big{position:absolute;right:unset;left:-16px}#gamelist-module .gamelist_item{zoom:110%}#gamelist-module .gamelist_itemrow{overflow:visible}#gamelist-module .gamename{font-size:20px;position:relative;left:10px;top:2px;color:#765}.notouch-device #gamelist-module .gamelist_item:hover{background-color:transparent}.notouch-device #gamelist-module a:hover{color:#765;text-decoration:none}.notouch-device #gamelist-module a .gamename:hover{color:#765;text-decoration:underline}#gamepanel-module .icon16_duration{filter:invert(1)}#gamepanel-module .challenge_image{filter:grayscale(1)}#gamelobby-module .pageheader_menu .pageheader_big_switch:hover,#gamelobby-module .pageheader_menu .dropdown_expanded .pageheader_big_switch{background-color:#565656}#gamelobby-module .pageheader_menu .pageheader_big_switch:hover .switcher_zone,#gamelobby-module .pageheader_menu .dropdown_expanded .pageheader_big_switch .switcher_zone{background:linear-gradient(#d3c2b1, #ffefde)}#gamelobby-module .pageheader_menu #lobby_friend_list_state>h3{color:#fff}#gamelobby-module .pageheader_menu #lobby_invited_friend_section>h3{color:#fff}#gamelobby-module .pageheader_menu #lobby_invite_more_friend_button .lobby_invite_friend_avatar,#gamelobby-module .pageheader_menu #lobby_add_friend_button .lobby_invite_friend_avatar{background-color:#321}#gamelobby-module .game_box_wrap{margin-right:20px;border:2px solid #210}#gamelobby-module .game_box_wrap.tables_available{border:2px solid #100}#gamelobby-module .game_box_wrap .wannaplay_item{background:radial-gradient(ellipse /**/at /**/center, #665544 /**/ -50%, #2a1908)}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_mask{left:unset;right:-20px;top:40px}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_mask .wannaplay_mask_button.del_favorite{background-color:#543;border:1px solid #100}#gamelobby-module .game_box_wrap .wannaplay_item .game_box_image_wrap{position:absolute;top:7px;zoom:120%}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename{top:250px}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner{width:90%;text-align:center;left:8px}#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner a:link,#gamelobby-module .game_box_wrap .wannaplay_item .wannaplay_gamename .gamenameinner a:visited{color:#765}#gamelobby-module .game_box_wrap .wannaplay_item .emblempremium_big{position:absolute;right:unset;left:-16px}#gamelobby-module .wannaplayauto_play_zone_content{display:none}#gamelobby-module .wannaplayauto_play_zone_content .wannaplayauto_button{box-shadow:0 5px 10px 0 rgba(17,0,0,.7)}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .game_box_mask{right:-26px}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .wannaplay_gamename{top:145px}#gamelobby-module .compactlobby .game_box_wrap .wannaplay_item .gamenameinner{width:90%}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .game_box_mask{right:-26px}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .wannaplay_gamename{top:145px}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .gamenameinner{width:90%}#gamelobby-module .verycompactlobby .game_box_wrap .wannaplay_item .game_box_image_wrap{top:15px}#gamelobby-module .tiny_verycompactlobby .game_box_wrap .wannaplay_item .game_box_image_wrap{top:2px;left:2px;zoom:unset}#table-module .pageheader{background-color:rgba(17,0,0,.4);color:#fff}#table-module .game_progression_bar{top:inherit;border:1px #a98 solid}#table-module .whiteblock{background-image:none;background-color:#543;border-radius:10px}#table-module .active_player_left{border-right:1px #765 solid}#player-module #pagesection_lastresults .post{border-bottom:1px #111 solid}.game_interface #spectatorbox{padding-left:8px}.game_interface #not_playing_help{color:#0cc}.game_interface #logs{overflow:scroll;scrollbar-width:none;-ms-overflow-style:none}.game_interface #logs::-webkit-scrollbar{width:0;height:0}.game_interface #logs .log .roundedbox{background-color:rgba(239,222,205,.65);border-radius:5px}.game_interface #logs .playername[style$='"#3ea7c6;"']{text-shadow:-1px -1px 0 #444,1px -1px 0 #444,-1px 1px 0 #444,1px 1px 0 #444}.game_interface #logs #seemorelogs{background:linear-gradient(0deg, black, transparent)}.game_interface .player-board{background:#eee}.game_interface .player-board.spectator-mode .roundedbox_topleft,.game_interface .player-board.spectator-mode .roundedbox_topmain,.game_interface .player-board.spectator-mode .roundedbox_topright,.game_interface .player-board.spectator-mode .roundedbox_main,.game_interface .player-board.spectator-mode .roundedbox_bottomleft,.game_interface .player-board.spectator-mode .roundedbox_bottommain,.game_interface .player-board.spectator-mode .roundedbox_bottomright{background:unset}.game_interface .player-board.spectator-mode .roundedboxinner{left:5px}.game_interface .player-name>a[style="color: #ffffff"]{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.game_interface #pagemaintitletext>span:first-of-type{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.game_interface #pagemaintitletext>span[style$='"#000000;"']:first-of-type{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777 !important}.game_interface #pagemaintitletext>span[style$='"#008000;"']:first-of-type{text-shadow:-1px -1px 0 #030,1px -1px 0 #030,-1px 1px 0 #030,1px 1px 0 #030 !important}.game_interface #pagemaintitletext>span[style$='"#0000ff;"']:first-of-type{text-shadow:-1px -1px 0 #116,1px -1px 0 #116,-1px 1px 0 #116,1px 1px 0 #116 !important}#community-module .col-md-6 .tips{background-color:#31200f}#chatbar .dropshadow{background-image:none}#chatbar .msgtime{position:unset;color:#987}#chatbar .chatwindowexpanded{background-color:#fed}#chatbar .chatwindowcollapsed{border-radius:7px 7px 0 0;box-shadow:0 0 7px 5px rgba(17,0,0,.3);background-color:rgba(255,255,238,.9)}#chatbar .chatwindowcollapsedtitle{top:6px;left:9px}#chatbar .chatwindowlogs{background-color:rgba(17,0,0,.66);box-shadow:0 0 7px 5px rgba(17,0,0,.5)}#chatbar .chatwindowlogs_zone .roundedbox.chatlog .roundedboxinner{background-color:rgba(255,255,238,.7);color:#100}#chatbar .chatwindowlogs_zone .roundedbox.chatlog.ownchatlog .roundedboxinner{background-color:rgba(117,100,83,.7);color:#fff}.cantstop_asmodee #dicechoices{color:wheat}#coloretto_wrapper #round_status{color:#fff}#coloretto_wrapper #deck_count{color:#fff}#game_play_area .lettertycoon_area{background-color:rgba(255,255,255,.2);border:none;color:#fff}#game_play_area .lettertycoon_area_label{color:#fff}#game_play_area .lettertycoon_deck_info{color:#fff}#playArea #down #decksizetext{color:#fff}#play-area #cards #cutCardSpace{color:#fff}#decks_and_available_achievements{color:#fff}#sevenwonder_wrap #card_rotation_wrap{color:#fff}#sevenwonder_wrap #card_rotation_wrap #handrotation{filter:invert(1)}#game_play_area_wrap #discard_count{color:#fff}#game_play_area_wrap #trees h3{color:#fff}#hanabi_prefs_button{background-color:#dcb}#betpanel+h3{color:#fff}#myhand+h3{color:#fff}#card_played{color:#fff}#gosu_wrapper h3{color:#fff}.xdu_notifTop{color:#fff}#recruitment{color:#fff}br.clear+h3{color:#fff}#deck_wrap{color:#fff}#table_setup{color:#fff}#flt_counters{color:#fff}#kahuna_right_pane{color:#fff}#krosmaster_interface #master_list .master{-webkit-box-shadow:4px 4px 37px 0 #000;-moz-box-shadow:4px 4px 37px 0 #000;box-shadow:4px 4px 37px 0 #000}#krosmaster_interface .playerstock{background:rgba(255,255,255,.2)}#krosmaster_interface .playerstock h2{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#krosmaster_interface .playerstock h2[style$='"#6f1e6b"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#hints_wrap h3{color:#fff}#hints_wrap #deck{border-color:#a98}#swd_wrap .player_area_name h3,#swd_wrap .end_game_player_name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#swd_wrap .progress_token_outline{border:1px solid #111;background:rgba(0,0,0,.2)}#pr_game_area .tiles_label{color:#fff}#pr_game_area #plantations,#pr_game_area #buildings{background:rgba(17,0,0,.2)}#thething .player_view,#thething .info{color:#fff;background:rgba(17,0,0,.1)}#sa_main #diceboard{background:rgba(0,0,0,.2);color:#fff;border:2px solid #111}#welcometo-container #plan-cards-container,#welcometo-container #construction-cards-container{background-color:rgba(145,128,111,.2)}#sushigo_wrapper #deck_container h3{color:#fff}#sushigo_wrapper .block_title{background-image:linear-gradient(180deg, rgba(77, 77, 77, 0.75), rgba(26, 26, 26, 0.75))}#zoomBox #characterSelectionDescription{background:rgba(0,0,0,.3) !important}#cards_title #torpedocards_title,#cards_title #playerhand_title{color:#fff}#coc_game #players-zone h3 span[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777 !important}#lostcities_wrapper #round_count,#lostcities_wrapper #deck_count{color:#fff !important}#game_play_area_wrap #player_bid_zone .player_bid_zone span[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#hud{box-shadow:inset 0 0 10px rgba(34,17,0,.67)}#hud+.play_grids .play_grid{box-shadow:inset 0 0 10px rgba(34,17,0,.67)}#hud+.play_grids .play_grid .player_name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000 !important}#bsk{color:#fff}#turn-container #nb-turns-container{color:#fff}#thurntaxis_board #carriages,#thurntaxis_board .gameAreaContainer{border:rgba(117,100,83,.5)}#thurntaxis_board #carriages h3,#thurntaxis_board .gameAreaContainer h3{color:#fff}#player_table h3[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}#market_map+#playerareas .playerArea .player-name{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#market_map+#playerareas .playerArea .player-name[style*='"#000000"']{text-shadow:-1px -1px 0 #777,1px -1px 0 #777,-1px 1px 0 #777,1px 1px 0 #777}.coord_label.luis{color:#fff}/*# sourceMappingURL=darkmode-cafe.css.map */
Contributed variants
Changes:
12/11/20: Revised chat styles
12/12/20: Fix for post-game header
12/23/20: Five across in the favorites section of the Play Now list
12/28/20: Adjust color of #async_table_banner to match icon; Significant changes to the game lobby page to increase box image size, remove redundant "Play Now!" button, and overall put more focus on the game rather than the chrome.
12/29/20: Make games list page consistent with the look and feel of the lobby page
12/29/20: Publish rebuilt black, blue, purple, and cafe variants
12/29/20: Add fix for Can't Stop dice choices text
12/31/20: Fixes and adjustments for dozens of games and main site issues
