WWW… Wednesday! 5 Useful Tools for Web Designers

by Taylor Slattery | September 23, 2020

I’m always on the lookout for new tools. If you’re anything like me, you’re always looking to further optimize your workflow. Anything that can save time or make difficult tasks easier is a welcome addition. Here’s a list of five tools I’ve found recently that have helped to make my life just that much easier.

Fontstand

When you’re first starting out as a designer, especially as a freelancer, one of the biggest hurdles to overcome can be building your font library. You may have enjoyed access to a wide range of fonts via your school or studio only to be confronted by steep price tags once you venture out on your own. Well-established type foundries are perfectly comfortable charging hundreds of dollars for their fonts and these start to add up fast. If you’re the type of designer who isn’t content with limiting your collection to 3 families, give Fontstand a look. It allows members to try a wide selection of fonts and rent those that they like by the month. Once a font has been rented for 12 months, it’s yours forever. They have partnerships with a large number of great type foundries and offer substantial savings over conventional purchase models. You can learn more here.

Khroma

Color is challenging. It’s such a subjective thing by nature that when it comes to serving a function in design, it’s easy to be unsure of your choices. Sure, they look alright to you, but will others feel the same way? Khroma is a tool that helps to remove some of the guesswork of color. It uses AI to generate palettes and pairings based on your preferences. Next time you’re looking for a scheme, be sure to give Khroma a try. You can find it here.

Hyperlog

As a developer, it can be challenging to find a way to display your work in an easily accessible portfolio. Static images do a great job of communicating visual design solutions but fall short when it comes to functionality. Hyperlog allows developers to showcase their code in a convenient, embeddable widget. It’s in public beta right now, and you can sign up here.

Bits

Coding can be repetitive. If you’ve ever found yourself typing the same bit of code for the 100th time, you know what I mean. You’ve likely found workarounds but sometimes they can be more trouble than they’re worth. Fortunately, this pain point is so universal, that it was just a matter of time before a solution presented itself. Bits is a library from Creative Tim that contains Bootstrap snippets for different pages and components independent of themes. Rather than modifying theme-specific code to fit your needs, use the Bits library to find exactly what you’re looking for. You can find it here.

Shoelace

Wouldn’t it be great if there were an open-source library of web components that worked across all frameworks and was supported by all major browsers? Turns out, there is one. It’s called Shoelace. It allows users to bypass the constraints of framework-specific components which helps to increase speed and avoid headaches caused by updates. If that sounds good to you, then be sure to check it out here.

That concludes the roundup. Hopefully, you find these tools to be as useful as I have.