#css (940 links)
- ModernCSS.AI moderncss.ai
Rules for the robust and accessible UIs that the web deserves, encompassing architecture, typography, colors, layout, and motion. One fetchable file.
From Mr Hallows.
Interesting seeing a move away from Tailwind, for good reasons.
Also CSS is pretty great now.
At some point I stopped asking, “How do I write this selector?” and started asking a better question: What if component state could be expressed declaratively, while the compiler handled the selector logic needed to make it deterministic? That question eventually became Tasty.
- The Incredible Overcomplexity of the Shadcn Radio Button paulmakeswebsites.com
- Should we NEVER use non-logical properties? frontendmasters.com
- The evolution of scalable CSS andreipfeiffer.dev
The evolution of scalable CSS is a multi-part chronicle intended to document the progress of tools, practices and techniques that enable us to write maintainable CSS at scale.
- Avoiding tokens blog.damato.design
Spicy times in design tokens world.
- Come to the light-dark() Side css-tricks.com
Dark mode interfaces have matured a lot in the past few years. We all know the "traditional" approach using media queries but in this article, Sara Joy demonstrates modern CSS features that make respecting user color scheme preferences pretty darn easy.
- Incomplete List of Mistakes in the Design of CSS wiki.csswg.org
- Reimagining Fluid Typography | OddBird oddbird.net
Relative units like em and rem are excellent for internal relationships – keeping the scale consistent between body text and headings, for example. But things always go wrong when we try to treat em as an alias for px, with mental conversions based on their assumed default relationship. At that point we’re keeping zoom, but discarding everything else about the user preference.
- Arabic & Persian Layout Requirements W3C Editor's Draft w3c.github.io
This document describes requirements for the layout and presentation of text in languages that use the Arabic script when they are used by Web standards and technologies, such as HTML, CSS, Mobile Web, Digital Publications, and Unicode.
Tailwind helps you build web pages quickly with a utility-first approach — but is it right for your project? Here we explore its benefits and trade-offs.
- Anchor Positioning Is Disruptive | OddBird oddbird.net
The more I play with it, the more convinced I am that anchor positioning is going to unlock some surprising new layouts.
- Orbit CSS Radial Framework zumerlab.github.io
Create radial interfaces using only CSS.
- New CSS that can actually be used in 2024 | Thomasorus thomasorus.com
Great list.
- Styling Light DOM htmlwithsuperpowers.netlify.app
- CSS Classes considered harmful - Keith Cirkel keithcirkel.co.uk
Class names are an archaic system that serves as a poor proxy for your UI primitives, and worse they're co-opted in awkward ways which results in combinatorial explosion of weird edge cases.
An interesting take, with a proposal attached.
- Inheritable styles pierce the Shadow DOM | HTML with Superpowers htmlwithsuperpowers.netlify.app
The Shadow DOM behaves like an <iframe> in its encapsulation. The Shadow DOM inherits some of the same quirks in the form of inheritable styles. Inheritable styles are styles that inherit the styles from their parent. Here's a list.
Somehow we forgot how to center rectangles and must find our way back
- 12 Modern CSS One-Line Upgrades | Modern CSS Solutions moderncss.dev
- Scoped CSS is back keithjgrant.com
The W3C spec is mostly stable, and there’s a working prototype in Chrome now. We just need a little interest from the community to entice other browsers to build their implementations and kick this over the finish line.
It’s time to get me up to speed with modern CSS. There’s so much new in CSS that I know too little about. To change that I’ve started #100DaysOfMoreOrLessModernCSS. Why more or less modern CSS? Because some topics will be about cutting-edge features, while other stuff has been around for quite a while already, but I just have little to no experience with it.
- Responsive Design In 2023 ishadeed.com
- Tailwind CSS is the worst… - YouTube youtube.com
It's not! Probably. It's micro-composable, which is super powerful but also makes it leaky like a sieve. Properly constructed, well-considered centralised components with nice API bounds are composable on a chunkier, more restrictive level but also safer and with a better chance of higher production values across experiences.
- SmolCSS smolcss.dev
- An Interactive Guide to Flexbox in CSS joshwcomeau.com
- Web color is still broken | Hacker News news.ycombinator.com
- Right-to-left Styling rtlstyling.com
- Defensive CSS - Ahmad Shadeed ishadeed.com
- Open Props open-props.style
Supercharged CSS variables.
- In Praise of the Unambiguous Click Menu | CSS-Tricks css-tricks.com
So it works out that, yet again, the ecosystem is ready for some pretty big changes to happen to CSS. The engineers at Chrome and across the web platform are prototyping, speccing, and starting the implementation for the next era of responsive design. These updates include user-preference based media features, container queries, and media queries for new screen types, such as foldable screens.
- John Doe’s page john-doe.neocities.org
This website is a single HTML file. It simply uses the #anchor suffix (from 1992) and the :target CSS selector to show and hide pages/content.
- The perils of functional CSS (atomic CSS) | Browser London browserlondon.com
- Hex Color Codes, Paint Matching and Color Picker encycolorpedia.com