CLEAN CUT'S Barbershop
Web DevelopmentFront-End Development
Old-World barbering on Central Ave, Orange NJ. Navy + cream + tarnished gold + barber-stripe red. Split-half sticky-left layout.
Next.js 16MotionTailwind v4
Overview
CLEAN CUT'S is a barbershop on Central Avenue, Orange NJ. Layout grammar is SPLIT-HALF — the left column sticks (md:sticky md:top-0 md:h-screen) showing the brand mark sandwiched between two animated barber poles (gradient stripes scrolling at opposite speeds), while the right column scrolls through four numbered Chapters. Playfair italic over Oswald condensed, navy + tarnished gold + barber-stripe red. The deco-rule hairline divider has diamond accents at both ends.
Features
- Split-half layout (left sticky brand panel, right scrolling content)
- Two animated barber poles flanking the brand mark
- Four numbered Chapters (Services · Barbers · Visit)
- Deco-rule hairline with diamond accents
- Lather-sweep ambient animation
Technologies Used
- Next.js 16
- React 19
- Tailwind CSS v4
- Motion
- Lenis
- Playfair Display + Oswald + Inter
Challenges & Solutions
Challenges
- Communicating Old-World craft without parody
- First IGRIS use of sticky-half-screen layout grammar
Solutions
- Italic Playfair signature on CLEAN, condensed Oswald on CUT'S — two type personalities
- Sticky brand pole stays anchored as the right side scrolls through chapters