The dog days of summer are here. From vacations to pool time, you might not be thinking about work that much. But there are still plenty of new tools and resources popping up to help you become a better or more efficient designer.
Here’s what new for designers this month.
Haikei is a web app that you can use to generate SVG shapes, backgrounds, and patterns in a web-based editor that you can use with any design tool or workflow process. Everything is customizable and it is free with access to 15 generator functions. (Additional templates and generators will be available when the pro plan is released later.)
Pixelhunter is a smart image resizer for social media platforms. It recognizes objects and crops pictures automatically. It supports 102 sizes and is free to use.
Compo is an Apple app that allows you to play with shapes and colors and create compositions on your own. You can see shapes and colors like the Bauhaus masters, creating from a blank canvas or shuffling in more creative ways. You can move, rotate, copy, overlap, and adjust shapes and colors to suit your style. Available for iPad and iPhone.
Backlight is an all-in-one design system platform that allows you to build code and reference sites in a space where designers and developers can work together. It has a series of “starter kits” to help you with the technology you use from React to Chakra to Tailwindcss. It’s designed to be collaborative with everything in one place and integrates into your workflows. The tool is just launching and you can request early access to learn more.
Multi Color Text With CSS
Multi Color Text With CSS is pure fun. Check out the pen by Shireen Taj.
Mega Creator is an online graphic design tool that helps you create images, icons, illustrations, backgrounds, and more for a number of uses. It has templates that are sized for common uses such as social media. You can upload your own elements to work with (free) or use including graphic assets for a fee.
Noloco is a no-code solution for designers to build web apps. You can start building for free and design almost anything you can dream up from a set of drag-and-drop ready-made blocks. (And it will work across all screen sizes.)
Tinter is a tiny web tool to generate color variations of images. The tool also generates monochrome colors of images with multiple variants, without hampering the quality of the image.
Radix Colors is an accessible, open-source color system for designing gorgeous websites and apps. It includes 28 color scales with 12 steps each and includes support for dark mode as well as matching transparencies.
WP Cost Calculator
WP Cost Calculator is a smart, simple tool that allows you to easily create price estimation forms. It’s perfect for a number of industries that use online pricing.
TraveledMap allows you to create customizable maps thanks to the use of markers, routes, and photos, which you can share or add to your website or blog. This tool is made for travelers and tourism pros.
Glyph Neue Icons
Glyph Neue Icons is a collection of 1,500 icons in SVG and PNG format. (They are free with a link.) Icons come in plenty of categories and styles for all types of use.
Streamline Icons is a set of thousands of icons in 12 different styles and themes that you can use for projects. They work through the Streamline app or a plugin for Figma, Sketch, or Adobe XD.
Health Icons is a set of free, open-source health icons for personal or commercial projects. They include filled and outline styles that are editable. There are more than 800 icons in the collection.
OMG, SVG Favicons FTW!
OMG, SVG Favicons FTW! Is a look at the benefits of using SVG favicons in web projects. It also examines some of the challenges – such as browsers support – with code snippets to help you get started.
Aspect Ratio in CSS
Aspect Ratio in CSS explores a design concept we talk about a lot in other places, but not so much with CSS. This piece by Ahmad Shadeed takes a look at how you can go beyond the “padding hack” and use native aspect ratio support in CSS to maintain image height and width ratios in responsive design.
Fight Kick is a bold font with a lot of personality. The free demo version has 249 characters and is for personal use only.
Glow Better is a beautiful premium typeface with a pair of options – a serif and script. Both contain letterforms with swashes and tails that are delightful.
Huggable Hedgehogs is a playful font that’s perfect for children’s projects. Everything has a mono-height in the all uppercase typeface.
Monice is a rounded sans serif with thick lines and high readability. It includes bold, regular, and italic styles with free (demo, personal) and commercial options.
Rustica is a robust premium typeface with 20 styles and family options. It has slim curves and an easy-to-read character set that would work for almost any use. It also supports 219 languages.