@simoncoudeville.bsky.social
I'm a designer and frontend developer making web interfaces since 2007. These days, I teach design and frontend development at Howest University in Kortrijk, Belgium. I have a blog now: https://simoncoudeville.be/
Apparently we live in the future now. With the latest versions of Chrome it's now possible to use CSS functions. This means you can define a function that encapsulates the fluid typography calculation. I updated my article and added another demo: simoncoudeville.be/blog/a-css-o...
A CSS-only fluid typography approach - Simon Coudeville
A look at how to implement fluid typography with no external dependencies. Only CSS variables, calc() and clamp().
simoncoudeville.be
October 1, 2025 at 8:41 PM
Apparently we live in the future now. With the latest versions of Chrome it's now possible to use CSS functions. This means you can define a function that encapsulates the fluid typography calculation. I updated my article and added another demo: simoncoudeville.be/blog/a-css-o...
In my first real blog post I wrote about applying fluid typography without generators or build tools. Just CSS variables, calc() and clamp(). simoncoudeville.be/blog/a-css-o...
A CSS-only fluid typography approach - Simon Coudeville
A look at how to implement fluid typography with no external dependencies. Only CSS variables, calc() and clamp().
simoncoudeville.be
September 24, 2025 at 7:17 PM
In my first real blog post I wrote about applying fluid typography without generators or build tools. Just CSS variables, calc() and clamp(). simoncoudeville.be/blog/a-css-o...
So I finally have a blog. You can read why it took so long here: simoncoudeville.be/blog/hello-w...
A Long Overdue Hello World - Simon Coudeville
This is my first ever blog post on my personal blog.
simoncoudeville.be
September 24, 2025 at 6:51 PM
So I finally have a blog. You can read why it took so long here: simoncoudeville.be/blog/hello-w...
Pure CSS squircles with corner-shape: superellipse(). codepen.io/simoncoudevi.... Check it out in Chrome or Edge because it's not baseline yet. (Even the preview can't render it yet, but it's a good fallback for now)
Pure CSS squircle
...
codepen.io
August 28, 2025 at 2:22 PM
Pure CSS squircles with corner-shape: superellipse(). codepen.io/simoncoudevi.... Check it out in Chrome or Edge because it's not baseline yet. (Even the preview can't render it yet, but it's a good fallback for now)
CSS random() 🥹: webkit.org/blog/17285/r...
Rolling the Dice with CSS random()
Random functions in programming languages are amazing.
webkit.org
August 27, 2025 at 2:07 PM
CSS random() 🥹: webkit.org/blog/17285/r...
I've been experimenting with Figma's Dev Mode MCP Server and Github Copilot in VS Code. It's the first time I find It's actually useful. It doesn't just take guesses at the whitepace, color, font-sizes and so on, it can actually get it from the design file's data.
August 27, 2025 at 12:31 PM
I've been experimenting with Figma's Dev Mode MCP Server and Github Copilot in VS Code. It's the first time I find It's actually useful. It doesn't just take guesses at the whitepace, color, font-sizes and so on, it can actually get it from the design file's data.
Cool! Gap decorations are now possible by extending the column-rule property. css-tricks.com/the-gap-stri...
The Gap Strikes Back: Now Stylable | CSS-Tricks
Styling the space between layout items — the gap — has typically required some clever workarounds. But a new CSS feature changes all that with just a few simple CSS properties that make it easy, yet a...
css-tricks.com
July 8, 2025 at 1:32 PM
Cool! Gap decorations are now possible by extending the column-rule property. css-tricks.com/the-gap-stri...
I needed a dotted world map illustration. None of the ones I found fitted my needs. Because I wanted all the dots to be on a pixel perfect grid I ended up drawing, moving and removing a lot of dots myself. My eyes still hurt. That's the kind of thing I expect AI to do for me...
May 23, 2025 at 8:07 AM
I needed a dotted world map illustration. None of the ones I found fitted my needs. Because I wanted all the dots to be on a pixel perfect grid I ended up drawing, moving and removing a lot of dots myself. My eyes still hurt. That's the kind of thing I expect AI to do for me...
Reposted
Using <div> everywhere is the same as naming every object in the world "thing".
We use words like "bike", "plant", and "table" because they give meaning to what you are talking about.
The same applies to HTML: If you show a heading then it should be a heading and not a "thing" that looks like one.
We use words like "bike", "plant", and "table" because they give meaning to what you are talking about.
The same applies to HTML: If you show a heading then it should be a heading and not a "thing" that looks like one.
wooahh Figma's new Sites thing produces no semantic HTML at all. Every single element is a div. Incredibly inaccessible
Example:
plugin-value-scrum.figma.site
Example:
plugin-value-scrum.figma.site
Modern Product Launch
Build buzz around your launch with this bold product template. A clean, focused design that makes it easy to highlight features, share updates, and drive early interest.
plugin-value-scrum.figma.site
May 8, 2025 at 10:39 AM
Using <div> everywhere is the same as naming every object in the world "thing".
We use words like "bike", "plant", and "table" because they give meaning to what you are talking about.
The same applies to HTML: If you show a heading then it should be a heading and not a "thing" that looks like one.
We use words like "bike", "plant", and "table" because they give meaning to what you are talking about.
The same applies to HTML: If you show a heading then it should be a heading and not a "thing" that looks like one.
Neat: Generate and customize CSS easing functions with ease and magical precision using Easing Wizard 🧙 easingwizard.com
Easing Wizard - CSS Easing Editor and Generator
Generate and customize CSS easing functions with ease and magical precision using Easing Wizard 🧙
easingwizard.com
January 20, 2025 at 8:49 PM
Neat: Generate and customize CSS easing functions with ease and magical precision using Easing Wizard 🧙 easingwizard.com