{
"$type": "site.standard.document",
"content": {
"$type": "site.standard.content.markdown",
"text": "## Articles\n* [Some practical examples of view transitions to elevate your UI](https://piccalil.li/blog/some-practical-examples-of-view-transitions-to-elevate-your-ui/?utm_source=the-index&utm_medium=newsletter) - Declan Chidlow here with some really practical uses of view transitions, along with some of the stuff that will trip you up, with guidance to help you navigate that.\n* [Animating CSS width or height no longer forces a Main Thread animation (in Chrome, under the right conditions)](https://www.bram.us/2025/11/13/animating-css-width-or-height-no-longer-force-a-main-thread-animation-in-chrome-under-the-right-conditions/?utm_source=CSS-Weekly&utm_medium=newsletter&utm_campaign=issue-628-november-19-2025&_bhlid=a7845fc6024bd0903453378e9fbe5bed71ed7c35) - When their values don't change throughout the animation, CSS width / height animations can run on the Compositor, instead of being forced to run on the Main Thread.\n* [More CSS random() Learning Through Experiments](https://frontendmasters.com/blog/more-css-random-learning-through-experiments/?utm_source=CSS-Weekly&utm_medium=newsletter&utm_campaign=issue-628-november-19-2025&_bhlid=d862df77ddd432c95ef4d9bd7184ddcb984c852b) - There is quite a bit of interesting design possibility with `random()` coming to CSS. It pairs nicely with animation, particularly animation-composition for agumenting those generated values.\n* [How to optimize SVG files: A complete guide for beginners](https://penpot.app/blog/how-to-optimize-svg-files-a-complete-guide-for-beginners/) - SVG files use mathematical formulas to create graphics, allowing infinite scaling without losing quality, and making them perfect for high-res displays and responsive design.\n* [Instant snapport](https://cssence.com/2025/scroll-margin-scroll-padding/) - How to tweak the optimal viewing region of the scrollport.\n* [Styling siblings with CSS has never been easier. Experimenting with sibling-count and sibling-index | utilitybend](https://utilitybend.com/blog/styling-siblings-with-CSS-has-never-been-easier.-Experimenting-with-sibling-count-and-sibling-index) - Ready to spice up your CSS? This article dives into the new sibling-count() and sibling-index() functions, showing you how they can simplify your styling and create cool effects.\n* [Front-End Field Notes – by Sara Soueidan](https://sarasoueidan.com/newsletter/) - - The personal website of Sara Soueidan, inclusive Web UI engineer\n\n## Demos\n* [CSS scoped custom property trail grid 👨🍳](https://codepen.io/jh3y/pen/wBMXOVz) - ...\n* [Cards path marquee CSS only](https://codepen.io/DenDionigi/pen/bNEvoMN) - ...\n\n## Sites\nNo sites this month\n\n## Videos\n* [CSS Attribute Selectors](https://www.youtube.com/watch?v=TWqpa-hfIdw) - Following up from last week's video, I explore some advanced attribute selector techniques that let you target elements based on how their attributes start, end, or contain specific values.",
"version": "1.0"
},
"description": "A list of links and demos I've collected over November 2025, with the intention of posting monthly",
"path": "/writing/page-turners-2025-11-27",
"publishedAt": "2025-11-27T00:00:00.000Z",
"site": "https://dominickjay.com",
"tags": [
"page turners"
],
"textContent": "Articles\n Some practical examples of view transitions to elevate your UI - Declan Chidlow here with some really practical uses of view transitions, along with some of the stuff that will trip you up, with guidance to help you navigate that.\n Animating CSS width or height no longer forces a Main Thread animation (in Chrome, under the right conditions) - When their values don't change throughout the animation, CSS width / height animations can run on the Compositor, instead of being forced to run on the Main Thread.\n More CSS random() Learning Through Experiments - There is quite a bit of interesting design possibility with coming to CSS. It pairs nicely with animation, particularly animation-composition for agumenting those generated values.\n How to optimize SVG files: A complete guide for beginners - SVG files use mathematical formulas to create graphics, allowing infinite scaling without losing quality, and making them perfect for high-res displays and responsive design.\n Instant snapport - How to tweak the optimal viewing region of the scrollport.\n Styling siblings with CSS has never been easier. Experimenting with sibling-count and sibling-index | utilitybend - Ready to spice up your CSS? This article dives into the new sibling-count() and sibling-index() functions, showing you how they can simplify your styling and create cool effects.\n Front-End Field Notes – by Sara Soueidan - - The personal website of Sara Soueidan, inclusive Web UI engineer\n\nDemos\n CSS scoped custom property trail grid 👨🍳 - ...\n Cards path marquee CSS only - ...\n\nSites\nNo sites this month\n\nVideos\n CSS Attribute Selectors - Following up from last week's video, I explore some advanced attribute selector techniques that let you target elements based on how their attributes start, end, or contain specific values.",
"title": "Page Turners - November 2025",
"updatedAt": "2026-06-08T09:40:21.602Z"
}