--- title: 20 Modern CSS Features You Should Know About | daily.dev description: A walkthrough of 20 modern CSS features introduced in 2025, covering invoker commands, dialogue light dismiss, popover hints, customizable select elements, CSS... canonical: https://daily.dev/posts/20-modern-css-features-you-should-know-about-aas8ag38s twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: 20 Modern CSS Features You Should Know About | daily.dev og:description: A walkthrough of 20 modern CSS features introduced in 2025, covering invoker commands, dialogue light dismiss, popover hints, customizable select elements, CSS... og:url: https://daily.dev/posts/20-modern-css-features-you-should-know-about-aas8ag38s og:image: https://api.daily.dev/og/posts/Aas8AG38s.png og:image:alt: 20 Modern CSS Features You Should Know About og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # 20 Modern CSS Features You Should Know About **[Joy of Code](https://daily.dev/sources/joyofcode)** · 30 min read · 41 upvotes · 1 comments ## Summary A walkthrough of 20 modern CSS features introduced in 2025, covering invoker commands, dialogue light dismiss, popover hints, customizable select elements, CSS carousels with scroll buttons and markers, scroll spy via scroll-target-group, anchored container queries, interest invokers, scroll state queries, sibling index/count functions, scroll-into-view container option, nested view transition groups, DOM state-preserving moveBefore API, advanced attr() function, event source on toggle events, textbox trimming, the shape() function, CSS if statements, custom CSS functions, expanded range syntax for style queries, the stretch sizing keyword, and corner-shape property. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Community discussion Top comments from developers on daily.dev. **@bonnieboni** · 0 upvotes > This is interesting ## Similar posts on daily.dev - [CSS Wrapped 2025](https://daily.dev/posts/css-wrapped-2025-9ejczoe0i) · CSS-Tricks · 3 upvotes · 1 comments --- Tags: [#webdev](https://daily.dev/tags/webdev), [#javascript](https://daily.dev/tags/javascript), [#css](https://daily.dev/tags/css), [#html](https://daily.dev/tags/html) [View this post on daily.dev](https://daily.dev/posts/20-modern-css-features-you-should-know-about-aas8ag38s) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"20 Modern CSS Features You Should Know About","url":"https://daily.dev/posts/20-modern-css-features-you-should-know-about-aas8ag38s","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/20-modern-css-features-you-should-know-about-aas8ag38s"},"datePublished":"2026-03-08T17:27:49.118Z","dateModified":"2026-03-08T17:28:22.989Z","description":"A walkthrough of 20 modern CSS features introduced in 2025, covering invoker commands, dialogue light dismiss, popover hints, customizable select elements, CSS...","image":"https://i.ytimg.com/vi/KGc5DYl6Lbs/sddefault.jpg","thumbnailUrl":"https://i.ytimg.com/vi/KGc5DYl6Lbs/sddefault.jpg","isAccessibleForFree":true,"articleSection":"Joy of Code","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Joy of Code","logo":"https://media.daily.dev/image/upload/s--_wpnboLQ--/f_auto/v1726499659/logos/joyofcode","url":"https://daily.dev/sources/joyofcode"},"commentCount":1,"discussionUrl":"https://daily.dev/posts/20-modern-css-features-you-should-know-about-aas8ag38s","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":41},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":1}],"keywords":"webdev,javascript,css,html","timeRequired":"PT30M","video":{"@type":"VideoObject","name":"20 Modern CSS Features You Should Know About","description":"A walkthrough of 20 modern CSS features introduced in 2025, covering invoker commands, dialogue light dismiss, popover hints, customizable select elements, CSS...","thumbnailUrl":"https://i.ytimg.com/vi/KGc5DYl6Lbs/sddefault.jpg","uploadDate":"2026-03-08T17:27:49.118Z","duration":"PT30M","url":"https://api.daily.dev/r/Aas8AG38s","embedUrl":"https://www.youtube.com/embed/KGc5DYl6Lbs"}} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Joy of Code","item":"https://daily.dev/sources/joyofcode"},{"@type":"ListItem","position":3,"name":"20 Modern CSS Features You Should Know About"}]} {"@context":"https://schema.org","@type":"WebPage","@id":"https://daily.dev/posts/20-modern-css-features-you-should-know-about-aas8ag38s","comment":[{"@type":"Comment","text":"This is interesting","datePublished":"2026-03-19T12:23:12.058Z","url":"https://daily.dev/posts/Aas8AG38s#c-PkaN88RMG","author":{"@type":"Person","name":"Mboni George","url":"https://daily.dev/bonnieboni","image":"https://media.daily.dev/image/upload/s--Y7cSx4cC--/f_auto/v1783679376/avatars/avatar_86i45FgMso7FgPmYePivk?_a=BAMAMicg0"}}]} ```