light and dark mode on bearblog
on your blog
- go to 'themes' (on your blog's dashboard)
- scroll down to 'edit theme css'
- for light/dark mode (based on user's device settings): change @media (prefers-color-scheme: light) to @media (prefers-color-scheme: dark)
- for light mode (regardless of user's device settings): remove the entire @media prefers block (don't forget the two brackets '}}' at the end)
- for dark mode (regardless of user's device settings): remove the @media prefers block and replace the root colors (at the top) with dark ones (make sure you only change the colours, not the width - font scale parts):
--background-color: #1f1b1b;
--heading-color: #e2e1e1;
--text-color: #cdcdcd;
--link-color: #cdcdcd;
--visited-color: #cdcdcd;
--code-background-color: #1f1b1b;
--code-color: #cdcdcd;
--blockquote-color: #cdcdcd; - [Note: the changes made here will be visible to anyone who views your blog]
on your dashboard
- go to your account from your blog's dashboard page (account represented by the bear in the top right)
- go to 'customise dashboard' under 'account'
- change the css under 'dashboard styles'. i do NOT know css so i had to ask chatgpt for help with this (i know, i know). you could try that too, or look for themes that people have made online. you could also change your device settings if it really bothers you. (changing the code will force either light or dark mode, depending on your preference)
- [Note: changes made here will only show on your dashboard, and will not be visible to other users]
final thoughts
this was something that confused me when i started using bearblog- and took some fiddling to work out! i decided to share it in case it confused anyone else (praying it's not just me...) i absolutely love bearblog despite being fairly new to it- and once i changed those little things my experience became perfect! i hope this helped you out too ◌