Mastodon

There Are Gonna Be Some Changes Around Here!

Posted by Matt Birchler
— 2 min read

Another 6 months means another iteration on the design of Birchtree! This is 100% a meta post, but I’ll try to keep it as interesting as possible!

Font Updates

My Hoefler&Co subscription was about to renew, and I just didn’t want to spend the money on fonts. I liked the fonts I was using, but I wanted to save a bunch of money so I dropped down to the following:

I hemmed-and-hawed for a while about the body text, and decided to just use the system font. They’re free and a few of them are variable fonts, so I get total control over the weight.

Colors

My previous color scheme was pretty muted, which I liked a lot, but if I’m looking at what’s coming on the horizon when it comes to web design, I think more and more sites are going to go with a bolder color palette and I wanted to be on the front end of that trend.

Web design is fashion, and while some sites stick with one look for years and years, I’m just not one of those people. I’ll never be done tweaking things here.

So I may have gone a little too far with links, but I think they’re fun. Shout out to Joseph Wood for figuring out how to get this Craft-like look in CSS, and I tweaked it to my personal taste. They’re big, bold, and I love them; I hope you do too.

Oh, and if I did them right, and I think I did, they should fall back to a solid color if your browser doesn’t support the tricks happening here.

Here's the relevant CSS if you were curious:

.post-content a {
  border-bottom: 2px solid #ed54e1;
  color: #ed54e1;
  background-image: linear-gradient(69deg, #ed54e1, #2595cc);
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: rgba (0,0,0,0.0001);
  color: transparent;
  -webkit-box-decoration-break: clone;
  font-weight: 600;
}

Next Up…

The next thing on the list is to figure out how to randomly tweak the colorful blobs above the site title each time the page loads. Ironically, I know how to do this easily in PHP, but this site is a JS operation, so I’m going to have to learn how to do something new, which will be fun!

I’m also on the hunt for some new icons for the menu that are a little more playful…praying I don’t have to make them custom because icons are my design kryptonite.