✏ Issue #483: Intrinsic Typography, Heartbeat of the Earth, Exciting New Tools For Designers, TinyVid, and more…

Experience a seamless creation process from concept to production with advanced design features on Editor X. - AD

When we style text for the Web, we define its characteristics at different breakpoints. Intrinsic Typography is an entirely different approach that attempts to style text based on its container instead of the viewport. Scott Kellum introduces us to the idea, together with some simple code examples, in this great primer.

TinyVid is an awesome free app for macOS, Windows, and Linux, that compresses video file size. Originally built for gamers sharing on Discord, it’s great for optimizing videos for embedding on a website, where every Kb counts. You can even change the resolution and framerate to squeeze the maximum speed out of your videos.

FLoC (Federated Learning of Cohorts) is Google’s approach to cookie-free, allegedly privacy-friendly advertising. Following the news that WordPress may disable it by default, Dieter Bohn reports that all of the browsers that use Google’s Chromium have declined to use FloC, potentially throwing the future of web advertising into chaos.

There are many approaches to responsive images, but few as impressive as JS Image Carver, JavaScript code that is content-aware and able to resize an image, repositioning key elements to create a compacted view of the original. Oleksii Trekhleb walks us through this experimental code explaining the logic behind this awesome script.

Relate is a powerful new site builder that brings easy collaboration to HTML and CSS code. Design your website with a set of simple tools, and the SaaS will translate it to markup and styles behind the scenes. You can import designs from Figma, Sketch, or XD and publish to AWS. There’s a free plan, and paid plans start at $15/month.

Every month there are hundreds of new tools unleashed on the Web. Every four weeks, we sift through them all to bring you this collection of the best resources for your toolbox. There are CSS frameworks, SVG generators, apps for boosting your productivity, illustration kits, and some excellent free fonts in April’s edition. Enjoy!

Do you like Material Design and Tailwind CSS? Then you’ll love Material Tailwind, a library for Tailwind, built by developers for developers, that implements Material Design principles. There are dozens of CSS and React components, with VueJS and Angular coming soon. Material Tailwind is free and open source.

It’s Earth Day 2021 this week, and to mark the occasion, the United Nations has collaborated with Google to promote four projects by designers exploring climate change through data visualization. From the plastic in the air around you, to plotting Mediterranean jellyfish, to rising sea levels, they’re impactful design experiments.