Lerp

Brethren Design Co

Free previewPro opens every clip, exact specs and prompts.

Get Pro →
Intro · 1440 px · 7 s · 30 fps
Step frames · Pro

Full page · Pro

SwiperNext.js 30 fps
Specs

The motion

Brethren Design Co is known for Swiper intro. Measured from frames; estimates from notes. Each fit includes its error.

Prompt

Prompt pack

The design establishes a bold, retro-futurist aesthetic defined by a high-contrast palette of deep maroon and pale pink. It blends heavy, industrial typography with playful imagery, such as founders pictured inside vintage computer monitors. The layout feels dense and tactile, utilising pinned scroll effects to stack content like physical folders. A continuous scrolling ticker adds kinetic energy, while the overall mood balances professional rigour with a distinctively quirky, handcrafted personality.

5 prompts in Pro Generated 25 Sep 2026

  • Recreate this site's feelEverything: look, layout, type, colour, motion and libraries, in one prompt.
  • Just the scroll feelSmoothing, what moves with scroll, pinned sections.
  • Just the introHow the page enters: sequence, curve, duration, stagger.
  • Just the hoversLinks, buttons and cursor: timings from the live CSS.
  • Just the type and colourFamilies, scale, weights, tracking and the palette with roles.

Pro opens every prompt with its measured values, and the tokens they are built from.

Unlock prompts with Pro

US$60/year or US$8/month. Cancel anytime.

Record

Capture record

Savedon 24 Sep 2026. Full pages, stills and key frames.

Pro opens the rest of the record: the whole page at each viewport, the key frames of every clip, and 4 key pages. See Pro

Captured

  1. 24 Sep 2026 Shown home · 1440 px · home · 390 px · key pages · 1440 px · key pages · 390 px
Notes

Brethren Design Co (brethrendesignco.com): Swiper intro.

dark · 5 effects · 30 fps clips

Motion
Intro, Scroll, Hover, Page transition
Libraries
Swiper, Next.js
Footage
1 clip, frame-stepped 30 fps
Captured
25 Sep 2026

a deep maroon block in pale pink. A pink ticker band, then a full-width thin wide-set "LET'S Do WORK!" with a hand-script "Do", a rounded pink panel with a cut-out photo of the two founders in pink overalls, and three columns with chunky display headings over small mono links.

Stack as observed

Next.js (App Router, Tailwind classes, next/image, Mux-hosted video); motion: GSAP + ScrollTrigger (2 .pin-spacer elements; bundle contains gsap, ScrollTrigger, SplitText, ScrollSmoother and a #smooth-wrapper, but scrolling is native), one full-screen WebGL2 canvas in the "Design that smokes" section, CSS marquees.

Techniques

Techniques on this site

Each one taught on its own page: a live demo you can tune, how it works, and the code. Split-text mask reveal, Infinite marquee, Stacking sticky cards.

More like this

Similar motion and feel.