Appreciate it! I think a stretch-goal for the future could be a "muted colors" toggle, to tone things down a little while keeping the rest of the changes
Awesome! Happy to have provided a semi-decent place to start. I'm curious what things you end up tweaking :)
You're too kind :) I think themes are a great way to differentiate instances, and having some community-made Beehaw themes available would be really cool!
Thank you! I played with lemmy.ml a bit since that's been updated, and it looks like ~80% of what I did should still work. But it does reveal the issues with making these client-side changes
I tried, but it's either beyond the scope of CSS edits, or simply beyond my abilities haha. Maybe proper themes installed to the instance could make that possible though!
I just released a theme based on this post if you'd like to try it!
If you'd still like to try the dark theme, I just released a theme based on this post! Would love to hear your feedback :)
Hey there! If you're still interested in trying it, I just released a theme based on this post!
Not sure if it's more relavant to Creative or Technology, so cross-posting here from: https://beehaw.org/post/743965
> Exactly a week later, hello again! > > I was so flattered by people's reaction to my last post - thank you for making me feel so welcomed by this community! I'm still toying with icon redesigns, but I noticed that people were equally (if not more) interested in the theme ideas I posted - so I've spent the last week trying to make them a reality! I call them Hive Light and Hive Dark, and I think they're ready to share with you all. > > I was able to incorporate lots of tweaks to Beehaw's UI, including: > > - Customisable levels of minimalisation > - Consistent padding and spacing site-wide, increasing legibility and cleanliness without sacrificing too much information density > - Repositioned various UI/UX elements to make Beehaw easier and more intuitive to navigate > - Consistent bee-themed colors! Lots of yellows, browns, and blues that play nice with each other and pass accessibility standards > - Hover effects to reduce unnecessary line breaks with long hyperlinks > - And more! But not that much more, it's just some CSS after all ;) > > Hive Light: > > ! > > ! > > Hive Dark: > > ! > > ! > > There are more screenshots on the GitHub! > > Installation is pretty simple as well: > > - Install Stylebot - this was the only CSS extension I found that worked reliably across browsers and consistently applied settings. YMMV with other extensions - Stylus just didn't work well for me :( > - Check your Beehaw settings and select "darkly" if you want to use Hive Dark, and "litely" if you want to use Hive Light > - Copy and paste the contents of either Hive_Light_Theme.css or Hive_Dark_Theme.css from the GitHub page into the "code" section of Stylebot > - Et Violà! > > This isn't my first time designing a UI, but it is my first time doing it with CSS edits, so I fully expect there to bugs and inefficient code. I would love to hear your feedback and incorporate new ideas into future versions. And feel free to copy my homework! If I can figure out this CSS stuff in a week, so can you, and I'd love to see what other people create. > > One caveat: the Lemmy v0.18.0 release includes lots of (really awesome) updates to Lemmy-UI that will break this theme. I don't know when Beehaw will update, but I imagine it's imminent, so there will be more work to be done soon I'm afraid. > > Thanks for reading, and take care!
Exactly a week later, hello again!
I was so flattered by people's reaction to my last post - thank you for making me feel so welcomed by this community! I'm still toying with icon redesigns, but I noticed that people were equally (if not more) interested in the theme ideas I posted - so I've spent the last week trying to make them a reality! I call them Hive Light and Hive Dark, and I think they're ready to share with you all.
I was able to incorporate lots of tweaks to Beehaw's UI, including:
- Customisable levels of minimalisation
- Consistent padding and spacing site-wide, increasing legibility and cleanliness without sacrificing too much information density
- Repositioned various UI/UX elements to make Beehaw easier and more intuitive to navigate
- Consistent bee-themed colors! Lots of yellows, browns, and blues that play nice with each other and pass accessibility standards
- Hover effects to reduce unnecessary line breaks with long hyperlinks
- And more! But not that much more, it's just some CSS after all ;)
Hive Light:
Hive Dark:
There are more screenshots on the GitHub!
Installation is pretty simple as well:
- Install Stylebot - this was the only CSS extension I found that worked reliably across browsers and consistently applied settings. YMMV with other extensions - Stylus just didn't work well for me :(
- Check your Beehaw settings and select "darkly" if you want to use Hive Dark, and "litely" if you want to use Hive Light
- Copy and paste the contents of either Hive_Light_Theme.css or Hive_Dark_Theme.css from the GitHub page into the "code" section of Stylebot
- Et Violà!
This isn't my first time designing a UI, but it is my first time doing it with CSS edits, so I fully expect there to bugs and inefficient code. I would love to hear your feedback and incorporate new ideas into future versions. And feel free to copy my homework! If I can figure out this CSS stuff in a week, so can you, and I'd love to see what other people create.
One caveat: the Lemmy v0.18.0 release includes lots of (really awesome) updates to Lemmy-UI that will break this theme. I don't know when Beehaw will update, but I imagine it's imminent, so there will be more work to be done soon I'm afraid.
Thanks for reading, and take care!
Exactly a week later, hello again!
I was so flattered by people's reaction to my last post - thank you for making me feel so welcomed by this community! I'm still toying with icon redesigns, but I noticed that people were equally (if not more) interested in the theme ideas I posted - so I've spent the last week trying to make them a reality! I call them Hive Light and Hive Dark, and I think they're ready to share with you all.
I was able to incorporate lots of tweaks to Beehaw's UI, including:
- Customisable levels of minimalisation
- Consistent padding and spacing site-wide, increasing legibility and cleanliness without sacrificing too much information density
- Repositioned various UI/UX elements to make Beehaw easier and more intuitive to navigate
- Consistent bee-themed colors! Lots of yellows, browns, and blues that play nice with each other and pass accessibility standards
- Hover effects to reduce unnecessary line breaks with long hyperlinks
- And more! But not that much more, it's just some CSS after all ;)
There are more screenshots on the GitHub!
Installation is pretty simple as well:
- Install Stylebot - this was the only CSS extension I found that worked reliably across browsers and consistently applied settings. YMMV with other extensions - Stylus just didn't work well for me :(
- Check your Beehaw settings and select "darkly" if you want to use Hive Dark, and "litely" if you want to use Hive Light
- Copy and paste the contents of either Hive_Light_Theme.css or Hive_Dark_Theme.css from the GitHub page into the "code" section of Stylebot
- Et Violà!
This isn't my first time designing a UI, but it is my first time doing it with CSS edits, so I fully expect there to bugs and inefficient code. I would love to hear your feedback and incorporate new ideas into future versions. And feel free to copy my homework! If I can figure out this CSS stuff in a week, so can you, and I'd love to see what other people create.
One caveat: the Lemmy v0.18.0 release includes lots of (really awesome) updates to Lemmy-UI that will break this theme. I don't know when Beehaw will update, but I imagine it's imminent, so there will be more work to be done soon I'm afraid.
Thanks for reading, and take care!
What's the Picasso quote? Great artists steal? :P This is a good suggestion, I'll definitely try it out! I've long used #f7f7f7 for white and #1a1a1a for black, but breaking that dogma here could be valuable
I'm a NYC native, and I am always struck by the accessibility of cultures we have to offer. Any time I discover a new cuisine or dish I haven't tried, I'm basically guaranteed to find it in this city. There are lots of things I hate about NYC, but I love that we've got so much of the world to offer, with a transit system that can get you there.
Love this feedback, thank you! It's a really interesting exercise, trying to make something that isn't professional - I've worked so long in our modern "clean and simple" landscape that it's tough to remember when I was younger, and things were more wholesome, simple, and authentic. I agree, for a site that is by definition "alternative," these logos are a bit too corporate looking. Glad you like the theme though!
Thank you for the kind words! I agree, I said in another comment but this is all "bee" and no "haw" in a way I figured wouldn't quite fit the feeling of the site. My design practice is unfortunately so "commercial" that it's hard to get my preconceived notions of icon design out of my head. Balancing approachability and character is tough! If I do another round, I'm gonna somehow get a cowboy hat in there haha
It think tweaking the specific shade of yellow to get better contrast is a good suggestion, I just lifted the shade from the community icons and ran with it haha. And I agree, this is very much a "bee" icon and not a "haw" one - you joke, but finding a way to incorporate a cowboy hat seems like a great idea to me!
Hi everyone!
I'm an Industrial/Product Designer in my professional life, and I was so inspired by @UrLogicFails's fantastic new community icons that I wanted to try out some of my own design ideas for Beehaw.
First, I tried my hand at an icon for Beehaw. I'm endeared to the little pixelated bee-cowboy we have now, but my background is in cleaner, more minimal designs that are easy to deploy to lots of different devices. A good logo sets a good first impression, and I want new users to see Beehaw as a real, legitimate alternative vision for social media. I've tried to recreate the back of a bee, and used the wings to form a subtle letter "B." My personal favorite is the hexagon bestagon, but I have both iOS and Android variations. Icon design is always really contentious, but it's also really fun - I'd love to see other people's ideas!
Second, I took a stab at tweaking the design of Beehaw, with the goals improving the layout and padding, introducing a more consistent color scheme, increasing legibility, and (of course) incorporating more bee elements. I'm working on a CSS theme that incorporates some of these changes, but others are beyond the scope of CSS injections and will require actual work on Lemmy-UI.
I'd love to hear your thoughts, and I'm happy to share more if people are interested :)
Thanks for viewing, take care!
Something I haven't seen mentioned is an alternative to /r/BuyItForLife - I'm often looking for honest thoughts and reviews of products from real people, but it feels silly to pop into !chat and ask what bike pump or jean brand or whatever people recommend.
This is one of those albums I come back to every couple months just to get lost in it. So much anger and wrath that resolves to so much relief and self-empowerment, there aren't many albums like it. I think it's the best of her trilogy of widely-released albums, but God Has Nothing to Do with This Leave Him Out of It and His Happiness Shall Come First Even Though We Are Suffering are also absolutely stellar.
sintamo @beehaw.org I make things, and people seem to like them.
@sintamo@kbin.social @sintamo@mastodon.social