Important clarification 👇

`satisfies` does NOT affect runtime behavior

It:
• Does NOT merge objects
• Does NOT override values
• Is purely a type-checking feature

✅ satisfies operator (TS 4.9+)

✔️ Enforces the shape
✔️ Preserves literal types ("#5a58f2")
✔️ Better autocomplete & inference

❌ Type annotation (: ThemeSchema)

This narrows the object to ThemeSchema

➡️ hex becomes string
➡️ Literal types are lost
➡️ Worse inference

Been working on a Design System and ran into a great TypeScript nuance that’s easy to miss 👀

The difference between : ThemeSchema vs satisfies ThemeSchema 🧵⬇️

Toggle Switch ...

codepen.io/ugi-dev/pen...

Switch Toggle 🔛

Link to #codepen 👇

Team Section ✨

#Codepen 👉 codepen.io/ugi-dev/pen...

Availability Tag ⚡ #GSAP #Codepen

codepen.io/ugi-dev/pen...

CardStackInt ...

codepen.io/ugi-dev/pen...

CardStack Interaction 🃏

Smooth shuffle animation using #GSAP. The details are key - timing, easing, and that satisfying snap.

What do you think? Any details you'd tweak?

Link to CodePen 👇

Animating a Gradient Mesh with GSAP Motion Paths — Ugi Stelmokaitis A journey into the world of gradient meshes and GSAP Motion Paths.

Animating a Gradient Mesh with GSAP Motion Paths - Article

ugi.dev/craft/gradi...

Dark code snippet showing "r.profile.name = "Bob";" with a red cross and "compile error" indicating assignment to a readonly property fails.

Now 👇

Dark code editor showing a TypeScript recursive DeepReadonly<T> conditional type and a User type with id and nested profile name.

✅ Do: Recursive conditional type

Dark code editor showing a single TypeScript line defining a type alias: "type ReadonlyUser = Readonly<User>;" with highlighted keywords.

Typescript 🔹

❌ Don't: Shallow readonly.

This is top level readonly

Result 👇

✅ Do: Conditional union filtering

🔹 Conditional Types to Filter Union Types

❌ Don’t: Manually redefine unions

Carousel animation made with #GSAP #React #Animation ✨

#X Space interaction 🎙️

Team Invitation ...

codepen.io/ugi-dev/pen...

Team Invitation 📩

Made with #GSAP 💚 #Codepen link bellow 👇

Good UI feels boring in a good way 🙂

Daily goal ✅

#codepen link 👉 codepen.io/ugi-dev/pen...

#Nextjs always delivers — fast, efficient, and future proof! ⚡
My personal website scored a perfect 100/100 on all Lighthouse performance metrics 🚀
ugi.dev

Fingerprint Scanner ...

codepen.io/ugi-dev/pen...

Fingerprint Scanner 🫆

Made with GSAP #codepen bellow 👇

Booking Confirmation 🛫 🎫

Made with #GSAP

Cooking something cool ✨👀

Interactive Cards ...

codepen.io/ugi-dev/pen...

Interactive Cards ✨

Link to #codepen bellow 👇