Visual Showcase

Visual Effects

A curated collection of stunning visual effects built with CSS, SVG, and framer-motion. Each effect is crafted for maximum visual impact.

Particle Text Effect

Interactive particle system that morphs between words

Particle Text Effect

Right-click and hold to destroy particles. Words change automatically every 4 seconds.

Aurora Background

Animated northern lights using CSS gradients & framer-motion

Aurora Borealis

Animated aurora effect using CSS gradients & framer-motion

Mesh Gradient

Organic fluid gradient animations with overlapping blurs

Mesh Gradient

Fluid organic gradient animations

Glow Effects

Neon and box-shadow glow effects in different colors

Neon Glow

box-shadow glow effect

Purple Glow

box-shadow glow effect

Emerald Glow

box-shadow glow effect

Patterns & Borders

SVG dot matrix patterns and animated gradient borders

Dot Matrix

SVG-based decorative dot patterns

Animated Gradient Border

CSS gradient animation on border

Glassmorphism

Frosted glass effect cards with different blur levels

Glassmorphism

Blur 4px

opacity 5

Blur 12px

opacity 10

Blur 24px

opacity 15

Blur 40px

opacity 20

Floating Elements

Animated shapes and particles with keyframe animations

Floating Elements

Animated shapes and particles with framer-motion keyframe animations

Border Beam

Animated beam of light traveling along the border of a card

Terracotta Beam

Animated border beam in primary colors

Dual Beam

Two beams traveling in opposite directions

Marquee

Auto-scrolling marquee with tech stack names

Next.js
React
TypeScript
Tailwind CSS
Framer Motion
Prisma
tRPC
Zustand
Vercel
shadcn/ui
Radix UI
Zod
React Query
Lucide
Next.js
React
TypeScript
Tailwind CSS
Framer Motion
Prisma
tRPC
Zustand
Vercel
shadcn/ui
Radix UI
Zod
React Query
Lucide
Next.js
React
TypeScript
Tailwind CSS
Framer Motion
Prisma
tRPC
Zustand
Vercel
shadcn/ui
Radix UI
Zod
React Query
Lucide
Next.js
React
TypeScript
Tailwind CSS
Framer Motion
Prisma
tRPC
Zustand
Vercel
shadcn/ui
Radix UI
Zod
React Query
Lucide
Node.js
PostgreSQL
Redis
Docker
Kubernetes
GraphQL
REST API
AWS
CI/CD
Git
WebSocket
Stripe
Auth.js
Edge Runtime
Node.js
PostgreSQL
Redis
Docker
Kubernetes
GraphQL
REST API
AWS
CI/CD
Git
WebSocket
Stripe
Auth.js
Edge Runtime
Node.js
PostgreSQL
Redis
Docker
Kubernetes
GraphQL
REST API
AWS
CI/CD
Git
WebSocket
Stripe
Auth.js
Edge Runtime
Node.js
PostgreSQL
Redis
Docker
Kubernetes
GraphQL
REST API
AWS
CI/CD
Git
WebSocket
Stripe
Auth.js
Edge Runtime

Meteors

Meteor shower effect on a dark card with subtle trails

Meteor Shower

Animated meteors streaking across the card with varying speeds and delays

Dense Meteor Field

Higher density meteors with faster animation and terracotta-tinted border

Animated Beam

SVG beam connecting two elements with animated gradient flow

Frontend
Backend

Built with ❤️ by Sandeep Gaddam