daniel petho

@nonzeroexitcode • 7,796 subscribers

design engineer @krea_ai

Shorts

150,029 views

116,571 views

151,458 views

57,752 views

44,373 views

80,275 views

59,752 views

89,523 views

57,489 views

42,745 views

15,394 views

25,352 views

23,497 views

17,578 views

18,173 views

Videos

sweetdream.ai

Watch Anya Live

Anya is streaming live right now! Join her private show and enjoy exclusive content.

Private Show

Join now for exclusive access

Free preview available • Premium content

136,393 views • 1 month ago

188,521 views • 1 year ago

68,567 views • 6 months ago

13,365 views • 1 month ago

29,216 views • 1 year ago

No more content to load

Live Cam

daniel petho

Shorts

a well-known iOS Safari quirk is that inputs with a font-size &lt;16px trigger an auto-zoom on focus using 16px is probably the best solution, but it can feel a bit heavy in tight UIs a clever workaround is to keep the font-size at 16px and scale the input down with CSS!

you don't need threejs for this effect just apply `perspective` to the container and animate each image with `translate3d(...)` over time, where depth is something like `z = z0 + speed * dt` and the rest is handled by the browser easy to map opacity or scroll to speed too

added some quality-of-life improvements to the cmyk emulator based on all the feedback: — more pre-filter settings, incl. better blur — better antialiasing, so (hopefully) no more artifacts — .mp4 record, on mobile too! thanks y'all!!

just published a figma plugin for the cmyk halftone editor! originally made this as a separate website for a figma hackathon and it felt weird not having it as a plugin there too, so here it is link in the comments↴

border-radius can actually take up to eight values, like: `10% 5% 5% 10% / 5% 10% 10% 5%` that lets you create all kinds of organic shapes in pure css! add blur + some layering and you can make it into a fancy glowing loader

tiny update————fancy components are now available through the official shadcn registry!

added video support to the cmyk halftone emulator! — it's free &amp; open-source, runs in your browser — tons of controls — can record the result into webm or just save the image

animating weight... i love variable fonts

marquee along an svg path

circular carousel v3————keeping the original transform of the items next: keyboard navs, scroll and a11y

in zoomable / canvas-like apps (like Krea Nodes) small controls get frustratingly hard to click when zoomed out adding an invisible hit area keeps them (a tiny bit) easier to use without changing visuals super easy with an `::after` pseudo element, `position:absolute` + sizing

circular carousel v5————added keyboard navs, wheel/touchpad control + a11y will finish the docs and publish it soon.

circular carousel v6————added proper css mapping based on angle (here blur + opacity) + experiments with css 3d transforms

Sensitive content

highlight text w/ scroll trigger

new component dropped: changing variable font settings based on cursor proximity source code in comments↴

Videos

Watch Anya Live

browsers mostly skip updating hover state while you scroll so I made super-hover, a tiny utility library that checks what's under your cursor every frame! `pnpm add super-hover`

Introducing Fancy Components: a collection full of fancy, fun, edgy and useless React components! — Built with react, ts, Tailwind CSS and Motion — Each comp. includes examples and docs to help you understand how it works and is built — 100% free &amp; open-source! link↴

making silly things in 2025 to many more in ’26 ——— see u there!

another super-hover demo using the events—sound triggered on enter event sound on🔊!

fancy components is live on product hunt! i appreciate your support if you feel like giving an upvote :) link in the comments↴

a well-known iOS Safari quirk is that inputs with a font-size <16px trigger an auto-zoom on focus using 16px is probably the best solution, but it can feel a bit heavy in tight UIs a clever workaround is to keep the font-size at 16px and scale the input down with CSS!

added video support to the cmyk halftone emulator! — it's free & open-source, runs in your browser — tons of controls — can record the result into webm or just save the image

Introducing Fancy Components: a collection full of fancy, fun, edgy and useless React components! — Built with react, ts, Tailwind CSS and Motion — Each comp. includes examples and docs to help you understand how it works and is built — 100% free & open-source! link↴