Front End Front
@frontendfront
26
subscribers
3.83K
links
News about front end technologies
Download Telegram
Join
Front End Front
26 subscribers
Front End Front
Lightning CSS
Piccalilli
Lightning CSS
I stumbled across this CSS processor and found it to be quite an interesting approach, so I talked about it in our typical project context.
Front End Front
Quantity Query Carousel
Frontend Masters
Quantity Query Carousel
The concept of a quantity query is really neat. Coined by Heydon back in 2015, the idea is that you apply different styles depending on how many siblings there are. They was a way to do it back then, but it’s gotten much easier thanks to :has(), which not…
Front End Front
Poking at the CSS if() Function a Little More: Conditional Color Theming
CSS-Tricks
Poking at the CSS if() Function a Little More: Conditional Color Theming | CSS-Tricks
The CSS if() function enables us to use values conditionally, but what exactly does if() do? Let's look at a possible real-world use case.
Front End Front
The Gap Strikes Back: Now Stylable
CSS-Tricks
The Gap Strikes Back: Now Stylable | CSS-Tricks
Styling the space between layout items — the gap — has typically required some clever workarounds. But a new CSS feature changes all that with just a few simple CSS properties that make it easy, yet also flexible, to display styled separators between your…
Front End Front
View Transition List Reordering (with a Kick Flip)
Frontend Masters
View Transition List Reordering (with a Kick Flip)
I remember when we first got animations and transitions in CSS on the web (ok grandpa), the talk around it was balanced between oooo! fun! shiny! and actually, movement is more than aesthetics; it can help people understand what is happening in user interfaces.
Front End Front
CSS Cascade Layers Vs. BEM Vs. Utility Classes: Specificity Control
Smashing Magazine
CSS Cascade Layers Vs. BEM Vs. Utility Classes: Specificity Control — Smashing Magazine
CSS can be unpredictable — and specificity is often the culprit. Victor Ayomipo breaks down how and why your styles might not behave as expected, and why understanding specificity is better than relying on `!important`.
Front End Front
Better CSS Shapes Using shape() — Part 4: Close and Move
CSS-Tricks
Better CSS Shapes Using shape() — Part 4: Close and Move | CSS-Tricks
The shape() function's close and move commands may not be ones you reach for often, but are incredibly useful for certain shapes.
Front End Front
A revisit of the Every Layout sidebar with :has() and selector performance
Piccalilli
A revisit of the Every Layout sidebar with :has() and selector performance
Heydon Pickering takes a fresh look the Every Layout Sidebar layout, 6 years on, to see if modern CSS selectors can improve it.
Front End Front
CSS conditionals with the new if() function
Chrome for Developers
CSS conditionals with the new if() function | Blog | Chrome for Developers
Learn about the new CSS if function, which enables a cleaner developer interface for dynamic styles like style queries and media queries.
Front End Front
Modern async iteration in JavaScript with Array.fromAsync()
Allthingssmitty
Modern async iteration in JavaScript with Array.fromAsync() - Matt Smith
JavaScript's 'Array.fromAsync()' offers a concise alternative to 'for await...of' when working with async iterables and streams.
Front End Front
Setting Line Length in CSS (and Fitting Text to a Container)
CSS-Tricks
Setting Line Length in CSS (and Fitting Text to a Container) | CSS-Tricks
The many ways to juggle line length when working with text... including two proposed properties that could make it easier in the future.
Front End Front
Stacked Transforms
Front End Front
What is popover=hint?
una.im
una.im | What is popover=hint?
Learn about what exactly this new popover feature does and how it relates to interest invokers.
Front End Front
A handy use of subgrid to enhance a simple layout
Piccalilli
A handy use of subgrid to enhance a simple layout
subgrid in CSS is really handy for getting a nice level of design detail in place, especially in terms of maintaining a nice reading line, as Andy shows in this article.
Front End Front
A Friendly Introduction to SVG
Joshwcomeau
A Friendly Introduction to SVG • Josh W. Comeau
SVGs are one of the most remarkable technologies we have access to on the web. They’re first-class citizens, fully addressable with CSS and JavaScript. In this tutorial, I’ll cover all of the most important fundamentals, and show you some of the ridiculously…
Front End Front
Designing for User Font-size and Zoom
OddBird
Designing for User Font-size and Zoom
Using modern CSS units and math functions
Front End Front
A First Look at the Interest Invoker API (for Hover-Triggered Popovers)
CSS-Tricks
A First Look at the Interest Invoker API (for Hover-Triggered Popovers) | CSS-Tricks
Chrome 139 is experimenting with Open UI’s proposed Interest Invoker API, which would be used to create tooltips, hover menus, hover cards, quick actions, and other types of UIs for showing more information with hover interactions.
Front End Front
The Figcaption Problem
Frontendmasters
The Figcaption Problem
When an image isn't
Front End Front
Step Gradients with a Given Number of Steps
Front End Front
Logical assignment operators in JavaScript: small syntax, big wins
Allthingssmitty
Logical assignment operators in JavaScript: small syntax, big wins - Matt Smith
Logical assignment operators (||=, &&=, ??=) streamline conditional assignments in JavaScript, making your code cleaner, safer, and easier to read, especially in modern front-end workflows.