π Highlights
Say hello to Roboto Serif (Google Font)
Google has released a new version of its Roboto typeface. It’s designed to be easier on the eyes and provides an ideal reading experience across various screen sizes. Google fonts source
Material (Typography)
Get Inspired by 70s Design Trends
Learn more about the characteristics of 70s graphic design and get inspired to explore these retro design trends.
Dribbble (Inspiration)
The Most Popular Front-end Frameworks in 2022
A review of the current front-end trends, upcoming frameworks, and pros and cons for the most popular ones.
StackDiary (JavaScript)
Web Design Done Well: Perfectly Pointless
This article shows weird and wacky websites, sometimes with pointless purposes, but still fun.
Frederick OβBrien (Inspiration)
Where Are our Design Heroes?
If you asked a young designer 20 years ago who their design heroes are, you’d hear some familiar names.
Tobias van Schneider (Inspiration)
π Tools / Resources
React Grid Table
A modular table, based on a CSS grid layout, optimized for customization.
NadavShaar
How to Create a Section Divider Using CSS
Create a responsive and easy to adjust section divider. Includes an online generator.
freeCodeCamp
Scroll made easy!
LetMeScroll is a utility that lets you programmatically respond to scroll behaviour with the additional feature of scroll bar styling. Check the demo.
BMSVieira (GtHub)
Add-to-Calendar Button
A JavaScript snippet to create buttons that allow users to add events to their calendars.
Jekuer (GitHub)
CSS Tricks to Transform Your Web Layouts
10 ways to transform your web layouts with CSS
Makeuseof
β‘ Snippets
- Why does Google still have that βIβm Feeling Luckyβ button?
- Comic Sans is a good typeface, actually
- Figma quick trick: negative spacing in auto layout
- Headless components in React
- Shave 90% of Google Fonts by declaring only the characters you need
π Deals
I bought InTab. They launched a lifetime deal for a limited time.
The tool is a browser extension that allows you to visually style and debug a website CSS very quickly. The license is browser-based (3 licenses included), but you can transfer any license an unlimited number of times.
If you stumble on deals like this, hit reply to this email and let me know. We can then share with the rest of the community, and save some π΅.
Thank you for reading this week’s issue. If you know anyone who may also enjoy this newsletter, please consider sending them to the signup page:
https://web-design-weekly.com/