Lightnews — Scholar-powered news

Cyd Stumpel

@cydstumpel.nl

760 followers 290 following 130 posts

Teacher and Award Winning Freelance Creative Developer Teacher at @fdnd.nl 🎓 and the Minor Web Development at Amsterdam University of Applied Sciences I’m an Okay Dev 👩🏽‍💻 @okaydev.co Tech speaker at meetups and conferences Portfolio: https://cydstumpel.nl

cydstumpel.nl

Posts Media Videos Starter Packs

Pinned

Cyd Stumpel @cydstumpel.nl · Mar 9

My portfolio won Site of the Day today on Awwwards! 🥳

3 1 37

Cyd Stumpel @cydstumpel.nl · 19h

Okay I might be going in a completely different direction now, how fun is this?!

🏗️ WIP

Created with CSS scroll driven animations, special shout out to color-mix too, that function has given me so much joy working with dynamic colors 🫶

1 2 40

Reposted by Cyd Stumpel

OKAY DEV® @okaydev.co · 3d

🚀 Big news! Okay Social is now open to everyone.
It's the social network for creatives.

Claim your handle, create a profile, and start connecting with others.

Join our community today!
👉 okaydev.co/social

4 18

Cyd Stumpel @cydstumpel.nl · 3d

You would love @beyondtellerrand.com then :)

1 4

Cyd Stumpel @cydstumpel.nl · 5d

The perfect recipe to create your own programming language, according to @dylanbeatt.ie @fronteers.bsky.social

1 4

Cyd Stumpel @cydstumpel.nl · 5d

I wrote a short post on the weird ‘bug’ I found this week when you animate custom variables and transforms on the same element cydstumpel.nl/debugging-in... please let me know if you can explain why the original approach doesn’t work like you’re explaining something to a five year old ✌️

Debugging in public | Blog Cyd Stumpel

During prototyping my ideas for next year’s ‘new year, new portfolio’ I came upon an interesting limitation in keyframes in combination with custom properties (CSS variables). I was prototyping an ide...

cydstumpel.nl

1 3

Cyd Stumpel @cydstumpel.nl · 6d

Ooh it might be because I put the animation on each individual box without setting it with a default value on the box and scoping it, which made it update multiple times..

1 2

Cyd Stumpel @cydstumpel.nl · 6d

What do you mean? It was on the transform property already, it is also already fixed btw! 🥳

Cyd Stumpel @cydstumpel.nl · 6d

But now the next thing; whyyyyyy does that work?

Cyd Stumpel @cydstumpel.nl · 6d

10 points to you! That fixed it!
codepen.io/Sidstumple/p...

Changing vars in scroll driven animation to use on hover is maybe too much 😅

...

codepen.io

1 1 4

Cyd Stumpel @cydstumpel.nl · 6d

Good guess, but it doesn't work 🥹

Cyd Stumpel @cydstumpel.nl · 6d

Haha yes, I tried that too, but it looks like it just transitions like the --scroll-progress value is 1, and then snaps to the actual value it should be

Cyd Stumpel @cydstumpel.nl · 6d

🆘 I'm trying to do too a thing, that may or may not be possible with @property💅.

I'm using a scroll driven animation to update a css var that goes from 0-1, to translate items in the opposite way on hover. The calculation works, transition does not🥹

Here's a codepen:
codepen.io/Sidstumple/p...

4 14

Cyd Stumpel @cydstumpel.nl · 11d

😂

Cyd Stumpel @cydstumpel.nl · 11d

It's truly crazy what you can do with just CSS now

🚧 WIP 🚧

6 10 160

Reposted by Cyd Stumpel

Adam Argyle @nerdy.dev · 12d

sticky slices

nerdy.dev/sticky-gradi... #CSS

1 2 57

Cyd Stumpel @cydstumpel.nl · 14d

Guys it's happening again, preparing for new year, new portfolio 2026. Welcome to my figma chaos.

Screenshot of a figma projects with inspiration and explorations

Cyd Stumpel @cydstumpel.nl · 21d

Damn, that's rough haha, pushing a fix now, thanks for letting me know

Cyd Stumpel @cydstumpel.nl · 21d

🫶

Cyd Stumpel @cydstumpel.nl · 21d

sibling-index and -count are going to be my whole personality now 💅

2 5

Cyd Stumpel @cydstumpel.nl · 21d

I wrote an article to celebrate scroll-driven animations finally landing in Safari 26, here are some things you probably want to know before using them:
cydstumpel.nl/start-using-...

Start using Scroll-driven animations today! | Blog Cyd Stumpel

To celebrate scroll-driven animations finally landing in Safari 26, here are some things you probably want to know before using them. Link to: The anatomy of a scroll driven animation We don’t need th...

cydstumpel.nl

3 14 56

Reposted by Cyd Stumpel

Una Kravets @una.im · 23d

Safari 26 is about to ship a bunch of CSS features I've been eagerly waiting for! 🥳

- Anchor positioning
- Scroll-driven animations
- text-wrap: pretty

Also cool to see contrast-color() land!

webkit.org/blog/17333/w...

WebKit Features in Safari 26.0

We’re happy to share with you what’s arriving in Safari 26.0!

webkit.org

2 5 43

Cyd Stumpel @cydstumpel.nl · 23d

Ah figured it out, it's because I used a css variable in the @supports 🙈

This works:

Cyd Stumpel @cydstumpel.nl · 23d

Very exciting that sibling-index is now supported in Chrome, but I can't figure out how to feature-check for it. This doesn't seem to do it. Setting the var with a backup like var(--delay, 0s) also does nothing 🆘

2 1

Cyd Stumpel @cydstumpel.nl · 27d

New year, new portfolio 💅

1 3

Cyd Stumpel @cydstumpel.nl · Sep 2

Wow thats so cool, thanks for telling me!

cydstumpel.nl/feed

https://cydstumpel.nl/feed

<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/eleme...

cydstumpel.nl

1 1