iiinova — where your digital self keeps evolving

Reposted by Konstantin Dankov

CSS by T. Afif @css-only.dev · 26/06/2026

💡 CSS Tip! An old design pattern solved by a modern CSS feature. css-tip.com/responsive-s... Learn how Gap Decorations makes it easy to add a separator between items using simple code with no hacks. It works with different alignment settings, and you can easily adjust the shape as well.

17317

Konstantin Dankov @dankov.me · 22/06/2026

@codepen.io Is there a reason I can't see more than one page of my loved pens? codepen.io/kdankov/pens...

codepen.io

Konstantin Dankov on CodePen

HTML & CSS, UI, UX

000

Reposted by Konstantin Dankov

Bramus @bram.us · 15/06/2026

New demo: Animated CSS Grid Layout. codepen.io/bramus/pen/o... Here’s the thing: No View Transitions. No JS at all. Instead, it uses Anchor Positioning to anchor the cell contents to the cell. Then, CSS transitions are used to animate the contents to their new location as the grid re-layouts.

416422

Reposted by Konstantin Dankov

CSS by T. Afif @css-only.dev · 16/06/2026

A diagram with various nodes and connectors? Yes, doable with pure CSS. Another demo powered by modern features! css-tip.com/node-connect... Regardless of the node's position, the connectors will adjust their shape and position for optimal connection 👀 Drag the elements and see the magic 🪄

824321

Reposted by Konstantin Dankov

CSS by T. Afif @css-only.dev · 28/05/2026

What about a straight line that bends when the circles get closer and stretches when they get farther. It's surely not possible using pure CSS, right? Right!? 👀 css-tip.com/bending-line/ Probably my new favorite demo, powered by the modern features. CSS is awesome! 😍

713220

Reposted by Konstantin Dankov

Chris Bolson @cbolson.bsky.social · 28/05/2026

A new #cssonly carousel demo built around the :scroll-* pseudo-elements. Using: – CSS anchor positioning for centered placement – container style queries to toggle between transition modes A fun experiment with some modern CSS features. See the demo on @codepen.io codepen.io/editor/cbols...

083

Reposted by Konstantin Dankov

Ahmad Shadeed @ishadeed.com · 24/05/2026

It's been two months since I launched The Layout Maestro interactive CSS course. For Eid, I'm running a $25 discount through Sunday, May 31. If you've been keeping the course on your radar, this is a good week to enroll in the course. thelayoutmaestro.com

thelayoutmaestro.com

The Layout Maestro by Ahmad Shadeed

Build any web layout with confidence. Learn practical CSS layout through visual lessons, interactive demos, and a proven layout mindset.

0217

Reposted by Konstantin Dankov

Overcommitted Podcast @overcommitted.dev · 21/05/2026

For all the folks that ever thought frontend development was "easy" This week on Overcommitted we chatted with @nerdy.dev all about job searching in 2026, career growth, and how and how the heck people figure out CSS in the age of AI. Check it out wherever you listen to podcasts!

23413

Reposted by Konstantin Dankov

CSS-Tricks* @css-tricks.bsky.social · 21/05/2026

It's a great time to get @sarasoueidan.com's Practical Accessibility course (25% off!) if you haven't already... ...and why haven't you already, eh? It's wonderful and worth every penny. practical-accessibility.today#buy

practical-accessibility.today

The Practical Accessibility Course

A get-right-down-to-it online course for Web designers and developers who want to start creating more accessible Web user interfaces and digital products today

194

Reposted by Konstantin Dankov

Piccalilli @piccalil.li · 21/05/2026

Let’s build a documentation-first, framework-agnostic component library using web standards and solve the combination of problems that would be present if we relied on frameworks, with Scott Riley. piccalil.li/blog/framewo...

piccalil.li

Framework-agnostic design systems: a practical approach to web components

Baking framework lock-in into your design system from day one is a recipe for obsolescence. Component documentation is often tedious and out-of-sync with development. Let’s build a documentation-first,...

1195

Reposted by Konstantin Dankov

Patrick Brosset @patrickbrosset.com · 21/05/2026

Folks like Kevin, who create content for the rest of us to make sense of the web, are a key part of our industry. They help us truly understand the concepts the web is based on, instead of just copying from outdated patterns or AIs. We need them in order to keep pushing the web forward.

1223

Reposted by Konstantin Dankov

Ahmad Shadeed @ishadeed.com · 19/05/2026

In case you missed it, I wrote about the CSS round() function. ishadeed.com/article/css-...

ishadeed.com

Better fluid sizing with round()

Using the round() function to get a more predictable fluid sizing.

1131

Reposted by Konstantin Dankov

Una Kravets @una.im · 15/05/2026

Gap decorations are now in Chromium 149 (stable rollout in 5 days)! Shoutout to the folks at Microsoft Edge for the implementation, post, and demos: developer.chrome.com/blog/gap-dec...

developer.chrome.com

Gap decorations: Now available in Chromium | Blog | Chrome for Developers

A new way to style gaps in CSS from Chrome and Edge 149.

16113

Reposted by Konstantin Dankov

CodePen @codepen.io · 14/05/2026

"CSS Only Marching Ants Border Effect" by Niklas Knaack codepen.io/NiklasKnaack...

0181

Reposted by Konstantin Dankov

Sacha Greif @sachagreif.com · 12/05/2026

I successfully ignored crypto and NFTs, I'm thinking I might just wait until this AI coding thing just blows over… larsfaye.com/articles/age...

larsfaye.com

Agentic Coding is a Trap | Lars Faye

Remaining vigilant about cognitive debt and atrophy.

43710

Reposted by Konstantin Dankov

Matthias Ott @matthiasott.com · 06/05/2026

“So, in short: you now have an LLM running on your machine, and any website you visit can make use of it, and whatever processing resources it requires.” The definitive piece on Google participating in the web standards process “the way a bear participates in the ‘camping’ process.”, by @wil.to 👏

wil.to

Google’s Prompt API

No web standard should require you to agree to an advertising company’s “terms of use.”

37404136

Reposted by Konstantin Dankov

jell @joshuaelliott.bsky.social · 28/04/2026

*sites making their elements less and less selector-targetable* CSS Zen Garden trained me for this day.

051

Reposted by Konstantin Dankov

Anime.js @animejs.com · 29/04/2026

Anime.js 4.4 is out with CSS transforms and Stagger improvements, plus a new scrambleText() helper to easily create complex text scramble effects! Docs: animejs.com/documentatio... Release notes: github.com/juliangarnie... Examples: codepen.io/collection/P...

0372

Reposted by Konstantin Dankov

MDN Web Docs @developer.mozilla.org · 29/04/2026

Did you know about Clear-Site-Data header? 👀 One HTTP header to clear cookies, storage, or cache for your site. Perfect for logout flows. Learn more 👇 developer.mozilla.org/en-US/docs/...

Code snippet demonstrating the syntax for the HTTP Clear-Site-Data header, including single, multiple, and wildcard directives.

011116

Reposted by Konstantin Dankov

Bramus @bram.us · 28/04/2026

Blown away by @andremichelle.bsky.social's openDAW, which runs ENTIRELY in the browser! 🤯 opendaw.org So much thought and attention to detail went into this. And it's all Open Source too! github.com/andremichell... The web is AMAZING 🤩 #BTConf

0344

Reposted by Konstantin Dankov

Josh W. Comeau @joshwcomeau.com · 24/04/2026

Whimsical Animations launches on Monday and I’m already getting the pre-launch jitters. 😂 I really think this is my best course. Excited to finally get it published! ✨

7533

Reposted by Konstantin Dankov

CodePen @codepen.io · 24/04/2026

"Colour loop" by Riley Shaw codepen.io/editor/riley...

0161

Reposted by Konstantin Dankov

Naomi "Strings" @fridaygoodybag.bsky.social · 24/04/2026

2 things about @kevinpowell.co's new CSS Demystified course. 1. I was terrified of layers and the course gives a great intro. No longer terrified. 2. His joy and excitement are contagious -- an instant mood lifter every lesson. For anyone learning CSS: courses.thecascade.dev

courses.thecascade.dev

The Cascade - Courses

0145

Reposted by Konstantin Dankov

Victor @vpon.me · 23/04/2026

CSS animations just got way more powerful. You can now animate gradients, numbers, and custom properties smoothly. @ property makes it possible.

Comparison of CSS animations showing variable interpolation versus smooth interpolation with @property for better animation control.

1182

Reposted by Konstantin Dankov

Amit Sheen @amitsheen.bsky.social · 22/04/2026

*Two* of my articles made it into the latest issue of Frontend Focus (@frontendfocus.bsky.social), which is, first of all, an honor, and second, it reminded me that I haven’t shared my article on “Building a UI Without Breakpoints” yet... (👇)

1122

Reposted by Konstantin Dankov

Stefan Judis @stefanjudis.com · 22/04/2026

Do you know that you can use `image-set` to serve different background images right in CSS? Now you do and `image-set` is "widely available" since last month! 🎉 developer.mozill...

Code snippet: .box { background-image: image-set(url("https://.../small-image.jpg") 1x, url("https://.../bigger-image.jpg") 2x); }

2438

Reposted by Konstantin Dankov

David Aerne @meodai.bsky.social · 22/04/2026

Spent way too long on that SVG sphere component. Added a bit of scroll interaction so people actually realize it’s 3D PS: you can download the sphere SVG from the settings panel rybitten.space

210212

Reposted by Konstantin Dankov

Chris Bolson @cbolson.bsky.social · 16/04/2026

Just another clock… but really an excuse to play with CSS anchor positioning to place time labels along expanding clock-hand rings. JS updates a few CSS custom properties, whilst CSS uses and display the values. The cheese color swapper was just an extra bit of fun. See the demo on @codepen.io

171

Reposted by Konstantin Dankov

Web Standards @web-standards.dev · 03/04/2026

The great CSS expansion. Pavel Laptev tours CSS features replacing JavaScript libraries like Floating UI, Radix, GSAP, and React Select, cutting up to 322 kB of JavaScript. #css #performance blog.gitbutler.com/t...

0144

Reposted by Konstantin Dankov

Jake Archibald @jakearchibald.com · 30/03/2026

I've proposed a series of changes to popover=hint. If you use web popovers, I'd love to know if the changes in the first post of this issue make sense, or, more importantly, if these changes would break your current usage of popovers. github.com/whatwg/html/...

github.com

popover=hint has multiple weird and inconsistent behaviours · Issue #12304 · whatwg/html

What is the issue with the HTML Standard? https://random-stuff.jakearchibald.com/popover-hint/ Videos below have audio. Weirdness 1 - does showing a hint popover hide unrelated auto popovers? neste...

2288

Reposted by Konstantin Dankov

Ahmad Shadeed @ishadeed.com · 25/03/2026

After a year of building, The Layout Maestro is officially live! 🎹🥳 An interactive CSS course that teaches you how to think in CSS layouts. 70+ lessons, 7 layouts, 150+ interactive demos! Ready to level up your layout skills? Enroll now👇: thelayoutmaestro.com

A tablet displaying the landing page for 'The Layout Maestro,' a practical CSS course by Ahmad Shadeed. The desk setup includes a cup of coffee, colorful pencils, and LEGO pieces, creating a bright and creative atmosphere.

513239

Reposted by Konstantin Dankov

Victor @vpon.me · 24/03/2026

Wouldn't it be great to have native image cropping in CSS? It actually exists: object-view-box.

Two framed illustrations show an image without and with an 'object-view-box' CSS property applied, highlighting the cropping effect.

2153

Reposted by Konstantin Dankov

Jennifer @chroniccoder.bsky.social · 23/03/2026

This could be the definitive guide to understanding CSS layout methods. From block to subgrid and container queries, this course breaks each layout method down for anyone to understand. It has tons of unique layout walk-throughs. It goes deep and wide enough for a foundation. thelayoutmaestro.com

thelayoutmaestro.com

The Layout Maestro

Build any web layout with confidence. Learn practical CSS layout through visual lessons, interactive demos, and a proven layout mindset.

122

Reposted by Konstantin Dankov

Web Standards @web-standards.dev · 23/03/2026

CSSkit, a high-performance CSS toolchain written in Rust. Keith Cirkel’s project combines parsing, minification, linting, formatting, and LSP integration into one zero-config tool inspired by oxc. #css #tools csskit.rs

0198

Reposted by Konstantin Dankov

Web Standards @web-standards.dev · 20/03/2026

Folded corner with CSS. Kitty Giraudel breaks down a hover effect where an image corner folds over using clip-path, a white triangle, and shadow elements. Plus CSS transitions for smooth animation. #css #animation kittygiraudel.com/20...

“Folded corner with CSS” title, a cat photo with a folded corner effect, and CSS code with .ImageContainer shadow and clip-path properties.

021

Reposted by Konstantin Dankov

Lea Verou, PhD @lea.verou.me · 18/03/2026

True, it’s not always WebKit that’s behind! In fact, here is some data: webstatus.dev/stats#missin... As of today, the number of features blocked by each browser is: - Safari: 55 - Firefox: 50 - Chrome: 12 I’ll let you draw your own conclusions…

1252

Reposted by Konstantin Dankov

natemoore on elm street 👻 @natemoo.re · 19/03/2026

Hell yeah new @mass-driver.com! MD UI looks awesome. So happy to have backed MD IO on futurefonts.com all those years ago. mass-driver.com/article/md-u...

mass-driver.com

MD UI: a Typeface for Interfacing

1491

Reposted by Konstantin Dankov

MDN Web Docs @developer.mozilla.org · 18/03/2026

Speed up rendering with content-visibility: auto ⚡ This CSS property skips rendering off-screen content until needed, giving massive performance wins on long pages. ⋅ Pairs with contain-intrinsic-size ⋅ Zero-effort lazy rendering Learn more 👇 developer.mozilla.org/en-US/docs/...

CSS snippet detailing the `content-visibility` property with keyword and global values for efficient rendering practices.

3668

Reposted by Konstantin Dankov

Friday Front-End @fridayfrontend.com · 17/03/2026

The Big Gotcha of Anchor Positioning: "I thought that one of the benefits of #CSS Anchor Positioning is you can position elements relative to others regardless of where they are in the DOM. But no, you can’t. There are limitations which feel inscrutable at first." frontendmasters.com/blog/the-big...

frontendmasters.com

The Big Gotcha of Anchor Positioning

As it stands, you have to think about the layout engine and whether an element is

021

Reposted by Konstantin Dankov

Ashley Watson-Nolan @ashn.uk · 17/03/2026

I've decided to have a dabble into the world of making video content. If you're interested in HTML/CSS/JS, AI coding tips and tutorials, and just frontend topics in general, subscribe to my new channel, Frontend Guidelines. www.youtube.com/@FrontendGui...

youtube.com

FrontendGuidelines

Modern web tech, frontend AI workflows, and practical dev tips and tricks. Hosted by Ash Watson-Nolan, a developer from Wales, in the UK. Weekly videos that will provide you with clear, actionable gu...

153

Reposted by Konstantin Dankov

David Roessli @davidroessli.mastodon.social.ap.brid.gy · 12/03/2026

Yay! 🎉 The grid lady (Rachel Andrew) 😉 just announced that subgrid becomes widely available next week! #WebDayOut

0102

Reposted by Konstantin Dankov

Manuel Matuzović @matuzo.at · 12/03/2026

TIL about the share_target manifest member, which allows installed Progressive Web Apps to be registered as a share target in the system's share dialog. #WebDayOut developer.mozilla.org/en-US/docs/W...

071

Reposted by Konstantin Dankov

Stef Walter @stephaniewalter.bsky.social · 11/03/2026

A little gem for my typography lover friends: a tool to visually explore glyphs from different typefaces designed by David Jonathan Ross glyphs.djr.com/

0107

Reposted by Konstantin Dankov

Web Standards @web-standards.dev · 11/03/2026

Everything you never wanted to know about visually-hidden. @dbushell.com traces the history of the pattern, tests a minimal CSS approach, and explains why the platform still lacks a native alternative. #a11y #css dbushell.com/2026/02...

“Everything you never wanted to know about visually-hidden” title and four CSS snippets: .visually-hidden with 11 properties, and three minimal alternatives with 2–3 properties each.

1138

Reposted by Konstantin Dankov

Patrick Brosset @patrickbrosset.com · 11/03/2026

Curious about custom <select>? I wrote about some of my recent demos over at @css-tricks.com! Take a look ✨ css-tricks.com/abusing-cust...

A vertical column of folders with labels on the right fanned out and curving towards the right.

Circular options with icons around another circular item in the center with a star icon.

08123

Reposted by Konstantin Dankov

Chris Woody Woodruff @handle.invalid · 07/03/2026

htmxRazor 1.2.0 is out. Toast notifications, pagination, ARIA live regions, CSS cascade layers, View Transitions API support, and hx-on:* attributes for htmx 2.x. All server-rendered. All Tag Helpers. All ASP.NET Core. htmxRazor.com github.com/cwoodruff/htmxRazor

0124