Hi, I'm Chuan. I'm a web developer with a passion for design, programming languages, and creative coding. I'm currently building css-doodle.
Visit yuanchuan.dev → On Hacker News May 2019 – May 2026
I used to see that retro multi-stroke text effect quite often and tried to replicate it using the CSS text-stroke property, but the results never quite matched. Because text-stroke accepts a single value, stacking elements was the only workaround I could think of, though it didn't seem to work.
It's been a while since I introduced a new syntax to the css-doodle project to solve my own problems. While I'm not sure it would be useful elsewhere, I need to make some notes before I forget the details.
In my earlier post Time Uniform For CSS Animation, I took a note about a way to do CSS animations with time ticks instead of keyframes. It was limited applicable because CSS lacked the ability of doing complex Math calculations. After years of wait, CSS now has enough Math functions supported, particularly mod()…
One day I saw a few pictures shared by my friend Fish. I was attracted by their slight blur and the subtle glowing effects, and wondered what kind of filter function was used. But then she told me it's just because the camera lens wasn't wiped clean.
Today I found another way to draw the Sierpinski triangle using pure CSS.
谁向云端着此亭，檐前树木映窗棂。 -- 释绍嵩《陪赵知府登桃岭山亭》 (image from 中国窗棂) The traditional Chinese window lattice has a symmetrical beauty, as well as a very beautiful formal name -- 窗棂.