--- title: Best Flavio Copes posts — August 2026 | daily.dev description: The most upvoted Flavio Copes posts from August 2026, curated by the daily.dev community. canonical: https://daily.dev/sources/flaviocopes/best-of/2026/08 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/sources/flaviocopes/best-of/2026/08 og:type: website og:site_name: daily.dev og:title: Best Flavio Copes posts — August 2026 | daily.dev og:description: The most upvoted Flavio Copes posts from August 2026, curated by the daily.dev community. og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph --- # Best of Flavio Copes — August 2026 1. 1 [](https://daily.dev/posts/scroll-driven-css-animations-uw6plcluy "Scroll-driven CSS animations") Article Flavio Copes · 3w Scroll-driven CSS animations A practical guide to CSS scroll-driven animations using animation-timeline with scroll() and view(), requiring no JavaScript. Covers building a reading progress bar, revealing cards on scroll, named timelines for sibling elements, choosing logical vs physical axes, adjusting view timeline insets and ranges, progressive enhancement with @supports, debugging techniques, respecting prefers-reduced-motion, and common mistakes like shorthand ordering and animating layout-heavy properties. Recommends checking MDN for current browser support before shipping. 140 5 2. 2 [](https://daily.dev/posts/a-deep-dive-into-nurb-zxytyn1kk "A deep dive into Nurb") Article Flavio Copes · 3w A deep dive into Nurb Nurb gives coding agents a full CAD workflow instead of asking them to generate meshes. Parts are written as Python functions using build123d and the Open CASCADE Technology kernel, producing real B-rep solids with editable dimensions, fillets, and chamfers rather than triangle meshes. A live browser viewer shows the part updating in near real time as the agent edits it, with sliders for dimensions, section cuts, and orbit controls. Real-world measurements live in a measurements.toml file so agents cannot silently guess dimensions, and Markdown 'cards' beside each part record design decisions and automatically logged facts (dimensions, volume, check results) to give future agent sessions memory. nurb check runs printability rules (thin walls, overhangs, build volume, etc.) with an honest disclosure that sampling-based checks can miss issues. Additional commands support slicing time/material estimates, approximate stress simulation, and multi-part assembly checks. Installable via a macOS app or CLI (curl installer or uv), the project is alpha-stage and licensed under FSL-1.1-MIT, which restricts competing products for two years before converting to MIT. 36 1 3. 3 [](https://daily.dev/posts/the-view-transitions-api-wqdsheaun "The View Transitions API") Article Flavio Copes · 3w The View Transitions API Explains how to use the View Transitions API to animate between DOM states using document.startViewTransition, covering fallback handling for unsupported browsers, CSS pseudo-elements like ::view-transition-old/new/group, naming shared elements with view-transition-name, waiting on the update callback with promises, cross-document navigation transitions, respecting prefers-reduced-motion, and common pitfalls like doing slow network work inside the transition callback. 23 4. 4 [](https://daily.dev/posts/css-container-queries-iq9qajosu "CSS Container Queries") Article Flavio Copes · 4w CSS Container Queries Container queries let a component style itself based on the width of its own wrapper rather than the browser viewport, making it possible to build cards and widgets that adapt correctly whether they sit in a wide main column or a narrow sidebar. The piece walks through marking an ancestor as a container with container-type: inline-size, writing @container rules on descendants (never on the container itself), naming containers to avoid nested containers stealing a query, container query units like cqi and cqw, why size containment exists and how it can collapse shrink-wrapped elements, and common traps such as copying page breakpoints onto components. It closes with guidance on when to reach for container queries versus sticking with media queries, and notes browser support is solid across current Chrome, Firefox, and Safari. 24 5. 5 [](https://daily.dev/posts/modern-css-colors-oklch-and-color-mix--elb1blipu "Modern CSS colors: oklch() and color-mix()") Article Flavio Copes · 3w Modern CSS colors: oklch() and color-mix() Modern CSS offers oklch() for defining perceptually uniform colors with lightness, chroma, and hue channels, and color-mix() for blending colors at runtime to derive hover states, tints, and theme variants. The guide covers reading oklch values, building lightness scales, converting existing hex colors, mixing toward a surface rather than plain white/black, handling gamut mapping issues, building dark themes, adding fallbacks with @supports, and avoiding common mistakes like assuming perceptual lightness guarantees contrast. 21 6. 6 [](https://daily.dev/posts/the-css-has-selector-csw5i3bag "The CSS :has() selector") Article Flavio Copes · 4w The CSS :has() selector An overview of the CSS :has() selector, the parent/relational selector that lets an element be styled based on its descendants or following siblings, eliminating the need for JavaScript-added helper classes like is-invalid or has-image. Covers form validation styling, image-aware cards, previous-sibling heading spacing, quantity queries with :nth-child, AND/OR logic, combining with :not(), specificity rules, limitations (no nesting, no pseudo-elements), performance guidance (avoid anchoring to body/root), and a note that browser support has been complete across Chrome, Firefox, and Safari since December 2023. 20 1 7. 7 [](https://daily.dev/posts/native-css-nesting-r3p5s5hro "Native CSS Nesting") Article Flavio Copes · 3w Native CSS Nesting Native CSS nesting lets developers group related selectors directly in the browser without Sass or Less, with no build step or source maps required. Covers basic nesting syntax, the & parent selector, positioning & later in a selector, nested media and container queries, and a specificity gotcha where selector lists behave like :is() and inherit ID-level specificity. Warns against copying Sass patterns like &\_\_title concatenation (invalid in native CSS) and against deep nesting that creates long, hard-to-override selectors. Offers guidance on when it's safe to drop Sass: mainly when it's used only for nesting, variables, and file splitting. 15 2 8. 8 [](https://daily.dev/posts/how-to-use-zoxide-9qarfnek6 "How to use zoxide") Article Flavio Copes · 3w How to use zoxide A practical guide to zoxide, a smarter cd replacement that learns frequently visited directories and lets you jump to them with partial path names. Covers installation on macOS, Linux/WSL, and Windows, shell setup for Zsh, Bash, Fish, and PowerShell, using the z and zi commands, inspecting and editing the frecency database, excluding directories, and when to prefer zoxide over plain cd. 21 1 9. 9 [](https://daily.dev/posts/css-easing-functions-what-cubic-bezier-actually-does-2uoqsmrtl "CSS easing functions: what cubic-bezier actually does") Article Flavio Copes · 6w CSS easing functions: what cubic-bezier actually does A deep dive into how CSS easing functions work under the hood. Explains the four control points of cubic-bezier(), maps named keywords (ease, ease-in, ease-out, ease-in-out) to their cubic-bezier equivalents, and covers overshoot effects using y values outside the 0–1 range. Also introduces the newer linear() function for complex bounce/spring animations and steps() for sprite-sheet or typewriter effects. Includes practical advice on which easing to use for entering, leaving, and repositioning UI elements, plus a note that easing applies per keyframe segment, not across the whole animation. 12 1 [See all Flavio Copes archives](/sources/flaviocopes/best-of) ```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","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/sources/flaviocopes/best-of/2026/08#page","url":"https://daily.dev/sources/flaviocopes/best-of/2026/08","name":"Best Flavio Copes Posts — August 2026","description":"The most upvoted Flavio Copes posts from August 2026, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/sources/flaviocopes/best-of/2026/08#items","numberOfItems":9,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/scroll-driven-css-animations-uw6plcluy","name":"Scroll-driven CSS animations"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/a-deep-dive-into-nurb-zxytyn1kk","name":"A deep dive into Nurb"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/the-view-transitions-api-wqdsheaun","name":"The View Transitions API"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/css-container-queries-iq9qajosu","name":"CSS Container Queries"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/modern-css-colors-oklch-and-color-mix--elb1blipu","name":"Modern CSS colors: oklch() and color-mix()"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/the-css-has-selector-csw5i3bag","name":"The CSS :has() selector"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/native-css-nesting-r3p5s5hro","name":"Native CSS Nesting"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/how-to-use-zoxide-9qarfnek6","name":"How to use zoxide"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/css-easing-functions-what-cubic-bezier-actually-does-2uoqsmrtl","name":"CSS easing functions: what cubic-bezier actually does"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Sources","item":"https://daily.dev/sources"},{"@type":"ListItem","position":3,"name":"Flavio Copes","item":"https://daily.dev/sources/flaviocopes"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/sources/flaviocopes/best-of"},{"@type":"ListItem","position":5,"name":"August 2026"}]}]} ```