Isiah Udofia[Digital Archive]

TECH STACK LAB

Tech stack footer variants

12 layout variations for displaying technology choices.

A — Icon Grid

FRAMEWORK
STYLING
ANIMATION
3D
BACKEND
AI
AGENTS

B — Sparse Grid

TECH STACK

FRAMEWORKNext.js 15 + React 19
STYLINGTailwind + inline styles
ANIMATIONFramer Motion + GSAP
3DThree.js / R3F
BACKENDPostgreSQL
AIClaude API + Textract
AGENTSClaude Code — Ghostty

C — Colophon

Built with

Next.js 15 + React 19 • Tailwind + inline styles • Framer Motion + GSAP • Three.js / R3F • PostgreSQL • Claude API + Textract • Claude Code — Ghostty

© 2025

D — Marquee

FRAMEWORK: Next.js 15 + React 19STYLING: Tailwind + inline stylesANIMATION: Framer Motion + GSAP3D: Three.js / R3FBACKEND: PostgreSQLAI: Claude API + TextractAGENTS: Claude Code — GhosttyFRAMEWORK: Next.js 15 + React 19STYLING: Tailwind + inline stylesANIMATION: Framer Motion + GSAP3D: Three.js / R3FBACKEND: PostgreSQLAI: Claude API + TextractAGENTS: Claude Code — GhosttyFRAMEWORK: Next.js 15 + React 19STYLING: Tailwind + inline stylesANIMATION: Framer Motion + GSAP3D: Three.js / R3FBACKEND: PostgreSQLAI: Claude API + TextractAGENTS: Claude Code — Ghostty

E — Two-Split

TECH STACK

FRAMEWORKNext.js 15 + React 19
STYLINGTailwind + inline styles
ANIMATIONFramer Motion + GSAP
3DThree.js / R3F
BACKENDPostgreSQL
AIClaude API + Textract
AGENTSClaude Code — Ghostty

F — Terminal

$ cat package.json

"framework": "Next.js 15 + React 19"
"styling": "Tailwind + inline styles"
"animation": "Framer Motion + GSAP"
"3d": "Three.js / R3F"
"backend": "PostgreSQL"
"ai": "Claude API + Textract"
"agents": "Claude Code — Ghostty"

$

G — Ruler

FRAMEWORKNext.js 15 + React 19
STYLINGTailwind + inline styles
ANIMATIONFramer Motion + GSAP
3DThree.js / R3F
BACKENDPostgreSQL
AIClaude API + Textract
AGENTSClaude Code — Ghostty

H — Horizontal Cards

FRAMEWORKFRAMEWORK
STYLINGSTYLING
ANIMATIONANIMATION
3D3D
BACKENDBACKEND
AIAI
AGENTSAGENTS

I — Compact Row

FRAMEWORKNext.js 15 + React 19
STYLINGTailwind + inline styles
ANIMATIONFramer Motion + GSAP
3DThree.js / R3F
BACKENDPostgreSQL
AIClaude API + Textract
AGENTSClaude Code — Ghostty

J — Vertical List

FRAMEWORK
FRAMEWORKNext.js 15 + React 19
STYLING
STYLINGTailwind + inline styles
ANIMATION
ANIMATIONFramer Motion + GSAP
3D
3DThree.js / R3F
BACKEND
BACKENDPostgreSQL
AI
AIClaude API + Textract
AGENTS
AGENTSClaude Code — Ghostty
FRAMEWORK/Next.js 15 + React 19•STYLING/Tailwind + inline styles•ANIMATION/Framer Motion + GSAP•3D/Three.js / R3F•BACKEND/PostgreSQL•AI/Claude API + Textract•AGENTS/Claude Code — Ghostty

L — Staggered

FRAMEWORKFRAMEWORK
STYLINGSTYLING
ANIMATIONANIMATION
3D3D
BACKENDBACKEND
AIAI
AGENTSAGENTS

TECH STACK LAB — 2025

12 VARIANTS