Skip to components
Back to portfolio

THE COMPONENT COLLECTION 01 — 02

Components with
character.

Small interactions, made with care. Explore the building blocks behind my portfolio. Make them your own.

Explore the source

Make it yours

PROPS

Respects reduced motion.
Colors and sizing are yours to change.

HelloWelcome.tsx

A warm welcome. A little personality.

LIVE PREVIEW
Use in your project
import { HelloWelcome } from './components/HelloWelcome';

<HelloWelcome
  value={"hello"}
  background="#0a0a0b"
  color="#fff8f0"
  fontSize={110}
  fontWeight={500}
  duration={3100}
  caption={"A warm welcome. A little personality."}
/>

 

01 / SELF CONTAINED

One import. Your style.

HelloWelcome includes its CSS automatically. Pass a value, choose your colors, and set the pace. No animation package is needed for hello.

02 / MADE TO INCLUDE

Motion with an off switch.

Skip or press Escape to enter the portfolio. Reduced-motion settings show a still greeting. The name logo finishes cleanly and stays readable.