Time to read: under 3 minutes
#513
October 2, 2024
Read on the web
Hey Designers!
This week we have:
* perfect spacing * menu patterns * dynamic numbering * animated grid layouts * and more…
🎥 Perfect Spacing for Web Designers
Expert spacing is what makes layouts work properly and look polished. By the end of this short video, you will know how to use spacing in order to make beautiful and functional layouts in Figma.
FLUX ACADEMY
3 Essential Design Trends, October 2024
This month’s design trends roundup focuses on being creative when you lack a strong visual.
CARRIE COUSINS
A Selection of Creative Menu Patterns & Animations
A selection of creative menu patterns and animations that highlight diverse design styles, offering fresh inspiration for your next project.
MANOELA ILIC
Payment in POS Design: UI/UX Best Practices and Inspirations
Best practices and inspirations, including POS UI designs, focused specifically on point-of-sale system design.
IZABELA PAWLIK & JOANNA CIESZYNSKA
Accessibility Guidelines for UX Designers
This article focuses mainly on guidelines specific to designers that would help to build a more accessible product.
AVINASH KAUR
TOOLS
* 👁 WhoCanUse – A tool that brings attention and understanding to how color contrast can affect people with different visual impairments.
* ↔️ Glyphs – Copy & paste symbols
🎥 Dynamic Numbering with CSS Counters
CSS Counters are one of those things a lot of people aren’t aware of, and most people who do know about them don’t realize all the things you can do with them! In this video, Kevin Powell explains hot to create one.
KEVIN POWELL
How to Animate CSS Grid Layouts
Learn how to animate a CSS Grid properties by building a responsive image grid with hover effects.
GEORGE MARTSOUKOS
Two CSS Properties for Trimming Text Box Whitespace
This article explains how to handle the whitespace that appears above and below the edges of our text boxes, by using two CSS properties.
BRIDGET AMANA
🎥 Enable *NEW* CSS Transitions Behavior
Find out how to enable new CSS transitions behavior that allows you to transition to intrinsic sizing keywords like “height: auto;” and how calc-size() implementation changed.
ZORAN JAMBOR
Understanding the CSS drop-shadow() Function
In this article, Arsalan explores the `drop-shadow()` function, its syntax, use cases, and how it differs from `box-shadow`.
ARSALAN
The Periodic Table in CSS
A simple way of building a periodic table in CSS.
MADS STOUMANN
🔗 Default behavior of position absolute
Comments or feedback?
Want to submit an article?
Hit reply to this email!
Never want to hear from us again? Break our hearts and unsubscribe.
#513
October 2, 2024
Read on the web
Hey Designers!
This week we have:
* perfect spacing * menu patterns * dynamic numbering * animated grid layouts * and more…
🎥 Perfect Spacing for Web Designers
Expert spacing is what makes layouts work properly and look polished. By the end of this short video, you will know how to use spacing in order to make beautiful and functional layouts in Figma.
FLUX ACADEMY
3 Essential Design Trends, October 2024
This month’s design trends roundup focuses on being creative when you lack a strong visual.
CARRIE COUSINS
A Selection of Creative Menu Patterns & Animations
A selection of creative menu patterns and animations that highlight diverse design styles, offering fresh inspiration for your next project.
MANOELA ILIC
Payment in POS Design: UI/UX Best Practices and Inspirations
Best practices and inspirations, including POS UI designs, focused specifically on point-of-sale system design.
IZABELA PAWLIK & JOANNA CIESZYNSKA
Accessibility Guidelines for UX Designers
This article focuses mainly on guidelines specific to designers that would help to build a more accessible product.
AVINASH KAUR
TOOLS
* 👁 WhoCanUse – A tool that brings attention and understanding to how color contrast can affect people with different visual impairments.
* ↔️ Glyphs – Copy & paste symbols
🎥 Dynamic Numbering with CSS Counters
CSS Counters are one of those things a lot of people aren’t aware of, and most people who do know about them don’t realize all the things you can do with them! In this video, Kevin Powell explains hot to create one.
KEVIN POWELL
How to Animate CSS Grid Layouts
Learn how to animate a CSS Grid properties by building a responsive image grid with hover effects.
GEORGE MARTSOUKOS
Two CSS Properties for Trimming Text Box Whitespace
This article explains how to handle the whitespace that appears above and below the edges of our text boxes, by using two CSS properties.
BRIDGET AMANA
🎥 Enable *NEW* CSS Transitions Behavior
Find out how to enable new CSS transitions behavior that allows you to transition to intrinsic sizing keywords like “height: auto;” and how calc-size() implementation changed.
ZORAN JAMBOR
Understanding the CSS drop-shadow() Function
In this article, Arsalan explores the `drop-shadow()` function, its syntax, use cases, and how it differs from `box-shadow`.
ARSALAN
The Periodic Table in CSS
A simple way of building a periodic table in CSS.
MADS STOUMANN
🔗 Default behavior of position absolute
Comments or feedback?
Want to submit an article?
Hit reply to this email!
Never want to hear from us again? Break our hearts and unsubscribe.