Micro.blog Rainbow Logo

Want to sprinkle some rainbow magic on your Micro.blog during Pride Month? Or why not keep the joy going all year round? Rainbows never go out of style! 🌈✨

Just hop over to ‘Design → Edit CSS’ and paste in the code below. I’m using the mnml theme, but it should play nicely with most standard ones.

.site-title {
  background: linear-gradient(to right, #ef5350, #f48fb1, #7e57c2, #2196f3, #26c6da, #43a047, #eeff41, #f9a825, #ff5722);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

Update: Here’s a way to add a colorful border to your avatar too. Totally unnecessary, of course — you’re already stunning! But if you want to, here you go:

.u-photo {
  height: 45px;
  width: 45px;
  border-radius: 50%;
  border: 3px solid #0000;
  background: linear-gradient(to right, #ef5350 0%, #f9a825 25%, #43a047 50%, #26c6da 75%, #2196f3 100%) border-box;
  background-clip: border-area;
  -webkit-background-clip: border-area;
}

Check out my blog for a fabulous example.

Posts