Pricing cards that line up with their table, and a sparse footer
Three plan cards sit over a striped comparison table on the same columns, plus a sparse footer with a single link column and two social icons.
Pricing Section v6. The v4 card layout without the WebGPU fluid, with Basic as the one dark card. Green checks and red crosses land under each plan, and feature names sit inside the Free column so the cards keep the full width.
Footer Section v5. A greyscale logo faces a Company column with LinkedIn and X icons, and the copyright and legal links sit in a bottom bar.
Pricing Section v1 now lists badge as a registry dependency, so installing it pulls the Badge component. The site also moves to Next.js 16.3.6, which patches the next/og ImageResponse advisory.
Charted case study results and a hover index for the team
The second case study and team sections, one charting every result and one turning the portraits into a hover index, plus a pared back centered hero.
Case Study Section v2. The headline moves above the cover image, and each of the three results gets its own small SVG chart: a stepped adoption line, a burndown against a dashed plan, and a before and after stage timeline.
Team Section v2. Names sit in a list, and a greyscale portrait slides to whichever row you hover.
Hero Section v13. A centered hero for a freelancer finance app with a badge, a two line headline, and a single rounded button.
How It Works Section v1 now uses muted text for its heading accent and step numbers in place of green.
Team portraits in 3D, a growth curve, and the first case study
The first team and case study sections, plus a stats section drawn over an edge to edge growth curve.
Team Section v1. A looping row of portraits where the active card lies flat and its neighbors turn toward it in 3D, with the name and title underneath.
Stats Section v4. Four stats and a two tone heading sit over a gray growth curve that fills the whole section, rising from the flat bottom left to the top right.
Case Study Section v1. A headline, summary, and three results in a divided list sit beside a tall rounded cover image.
Tilted testimonial cards and a subgrid pricing table
Tilted quote cards, a pricing grid built on CSS subgrid, two photo carousels, and block previews you can resize by dragging.
Testimonials Section v7. Three quote cards stack with small alternating tilts, and the one you hover straightens and moves to the front.
Pricing Section v5. Hobby, Pro, and Enterprise share one bordered grid, and CSS subgrid keeps prices and feature lists level across the columns.
Gallery Section v5. Square photos ride a slowly turning ring whose top arc frames the title, and hovering a card pauses it.
Gallery Section v6. An overlapping row of framed photos with a larger center card that carries the title and a pill button. Photos blur slightly while the row moves.
Block and template previews now have a drag handle on the right edge that resizes them to any width down to mobile.
A sixth portfolio starter with a quiet centered CV, date-left career rows, About and Writing tabs, and the same Jon Doe filler as v3.
A sixth portfolio starter, installed with shadcn init --template like the others.
Portfolio v6. Narrow Inter column, circular portrait header, and floating About | Writing pill. Work, side projects, awards, certifications, destinations, events, education, and contact use the same muted date-left rows. Writing lives at /writing with Back and Previous / Next on each post.
Sticky pixel FAQ type sits beside a dashed plus accordion. Three muted pricing cards list features under the card, with a Pro credit dropdown over a WebGPU fluid, a titleless marquee, and a stacked color logo row.
FAQ Section v6. Two column layout with a sticky pixel font FAQ title on the left and a dashed plus accordion on the right. Same two column job as v4, without the marketing copy column.
Pricing Section v4. Three muted cards with feature lists under the card, not inside it. Pro picks a credit pack that updates the price and runs a WebGPU fluid behind the card.
Brands Section v9. One infinite row of wordmarks, no heading. Logos are grayscale and faded so brand color never shows.
Brands Section v10. Title, a wrapping color logo strip, then a muted closer. No marquee.
A single page left column of about copy, social links, and projects for Jon Doe filler, fixed over a fullscreen WebGPU Optimized Black Hole.
A fifth portfolio starter, installed with shadcn init --template like the others.
Portfolio v5. Dark only Oxanium type, Button link underlines for socials and project names, and a fixed WebGPU black hole behind the column. Inspired by vgpu Optimized Black Hole.
A bracket timeline changelog, plus a layout without one
Changelog Section v3 stacks entries under a bracket timeline of long form dates on the left. Changelog Section v4 drops the rail for a horizontal rule per date group instead, with no left column at all.
Two more ways to lay out release notes, both built on the same date grouped entries and contributor avatar groups.
Changelog Section v3. Long form dates run down a bracket timeline on the left, with a title, description, and contributor avatar group for each entry on the right; entries sharing a date stack under one node.
Changelog Section v4. Same entries and avatars, no rail. Each date opens on a horizontal rule, and the entries under it keep the same spacing from that rule whether there is one entry or several.
A portfolio that renders as one interactive terminal
A bash style prompt that boots with a FIGlet name banner and answers about, work, resume, and help with formatted output. Arrow keys replay command history, Ctrl+L clears the screen, and ls turns up destinations and events that never appear on the prompt list.
A fourth portfolio starter that renders as one interactive terminal, installed with shadcn init --template like the other portfolio starters.
Portfolio v4. Same Jon Doe career data as v3. Inspired by justbash.dev.
Split flap cells scramble across a fullscreen coming soon board, then keep flipping a live countdown that drops days, hours, and minutes as each unit hits zero.
A third landing page template for coming soon pages, installed with shadcn init --template like the waitlist and event starters.
Landing Page v3. Fullscreen Solari split flap board that powers up with staggered cell flips, then ticks a live countdown and flaps a unit into blanks when days, hours, or minutes hit zero.
Scroll the page to move a year by year career rail, with color coded work, school, destinations, and people you met, plus stills or clips that expand from the timeline.
The third portfolio starter, drawn from github.com/evilrabbit/lifeline, installed with shadcn init --template like the others.
Portfolio v3. A fullscreen career lifeline for a fullstack developer, with Jon Doe filler milestones, drop in photos and videos, a footer theme switcher, and a lightbox that morphs from the rail. Inspired by evilrabbit/lifeline.
A weekend event starter with brand first display type over an auto cycling WebGL color field, a ticket CTA into a multi step questionnaire register flow, and Base UI toasts on submit.
A second landing page template aimed at hackathons and ship weekends, installed with shadcn init --template like the waitlist and portfolio starters.
Landing Page v2. Full bleed WebGL glow behind a brand first hero (date badge, display title, punchline, ticket CTA), directional view transitions into /register, a multi step Questionnaire for role track and email, and ThemeProvider driven light or dark tokens for the toaster.
Blog spotlight, masonry gallery, and inverted carousel hero
The first blog section with a featured post beside a trending list, a CSS grid masonry gallery that reveals on scroll, and an inverted card hero with autoplay slides. Also release note cards, a Retro Dither CTA, static FAQ with helpfulness, a film grain footer, and masonry quote columns.
Eight new page sections spanning editorial content, social proof, and conversion.
Blog Section v1. Two column magazine layout with a large spotlight article and author avatar beside a staggered list of trending posts with thumbnails.
Gallery Section v4. Dense CSS grid masonry of mixed height photos that ease in when scrolled into view. No header copy, images only.
Hero Section v12. Large headline above an inverted rounded card split between copy with dual CTAs and a sliding photo stage with autoplay, prev next, and progress pips.
Changelog Section v2. Three card release notes with date and category rows under each title, plus a Read announcement button. Same release notes job as v1 in a card grid instead of the three column strip.
CTA Section v6. Centered workspace pitch over a Canvas UI Retro Dither frame with a single rounded full CTA.
FAQ Section v5. Stacked question and answer pairs under a last updated line, with a muted Was this helpful bar and community link at the bottom. No accordion.
Footer Section v4. Logo and brand name beside three link columns over a subtle film grain texture, with copyright and office line.
Testimonials Section v5. Badge, headline, and short intro over a three column masonry of bordered quote cards with avatars.
A Clerk powered fullscreen waitlist starter with a boiling ink print hero, plus compact three tier pricing cards with a billing switch and grouped feature lists.
The first landing page template joins the portfolio starters, installed the same way with shadcn init --template.
Landing Page v1. Fullscreen startup waitlist with a misregistered boiling display title over a floating hex tile cursor field on the left, and Clerk Waitlist (shadcn theme) on the right, including a keyless demo form until keys are set.
Pricing Section v3. Three tier cards with a monthly and yearly switch, grouped feature lists, and a centered two line headline. Same billing toggle idea as v2 in a tighter three plan layout.
A travel hero and a theme aware particle feature section
A two panel travel booking hero with a pointer driven Canvas UI Displacement image, and a features section with a left side Canvas UI ParticleObject panel that rebuilds a flat image as particles and recolors for light or dark mode.
Hero Section v11. Two panel travel hero with an integrated ACME nav, headline, and dual CTAs beside a full bleed destination image that ripples with Canvas UI Displacement on pointer move.
Feature Section v11. Left side Canvas UI ParticleObject panel that rebuilds a flat image as particles colored to match the current theme, beside a Geist Sans headline over a two by three icon and copy feature grid.
A static personal site with hardcoded notes, projects, and experience columns, wrapped in a WebGL cursor effect that trails and warps the live page in Chromium.
A different shell from Portfolio v1: no MDX, no CMS, everything hardcoded in the page.
Portfolio v2. A two column intro above a three column notes, projects, and experience layout, an avatar and copy to clipboard email, dark and light themes, and a Canvas UI liquid effect that trails the pointer and warps on screen text in Chromium.
iPhone mockup, shader testimonials, and two column FAQ
A front facing iPhone 17 Pro Max device frame with image and video screen variants, a three up shader portrait testimonials carousel, and a two column FAQ with marketing copy beside a plus minus accordion.
FAQ Section v4. Two column layout with left side eyebrow, headline, description, and dual CTAs beside a bordered plus minus accordion.
Testimonials Section v4. Centered headline with dual CTAs above a three up carousel of six customer stories, each with a Paper shader portrait and Read story link.
iPhone 17 Pro Max (w/ image). Phone mockup with a silver titanium rail, black rounded bezel, Dynamic Island, and iOS status bar over a bundled screen wallpaper.
iPhone 17 Pro Max (w/ video). Same frame with a bundled screen video.
A new template install path, starting with a portfolio
Templates are full Next.js starters you install with shadcn init, beginning with a minimal portfolio for developers, writers and personal projects.
Templates sit next to blocks as a new install path: a complete Next.js app rather than a single section, installed with shadcn init --template.
Portfolio v1. A science themed starter for writers, set in Geist Mono for a typewriter feel, with MDX powered writing and book pages, a Saturn decoration, and a Basin contact form.
Two navbar layouts and a feature section with a hover driven wireframe preview.
A quieter text only navbar with a Resources mega menu, an Edra inspired nav that expands the hamburger in place, and feature cards that morph a wireframe on hover.
Navbar Section v9. Text brand mark, nav links, and an outline Sign in button with a full width Resources mega menu.
Navbar Section v10. Hamburger expands into a dialog card of primary and footer links.
Feature Section v10. Dashed corner accent cards next to a wireframe preview that updates on hover.
Testimonials, device mocks, and auto install media
Quote carousels and bordered testimonials, MacBook and Chrome video mocks, and block media that installs with shadcn add.
Testimonials, more device mocks, and navbar and feature layouts for AI SaaS land in this drop. Block images and video now install automatically with shadcn add, so you no longer need to copy assets into public/ by hand.
Hero Section v8. Pixel art scene preview, brand carousel, and a centered Simple Chatbot prompt overlay.
Navbar Section v7. AI SaaS navbar with Product and Developers dropdowns and a Get started CTA.
Feature Section v7. Three column cards for agent workflows, grounded knowledge, and production deploys.
Testimonials Section v1. Horizontal quote carousel with initials avatars and chevron navigation.
Testimonials Section v2. Three column bordered quotes with serif italics, square avatars, and company wordmarks.
MacBook Pro (w/ image). MacBook Pro frame with a bundled screen wallpaper.
MacBook Pro (w/ video). Same frame with a bundled screen video.
Google Chrome (Windows, w/ video). Windows Chrome mock with video under the omnibox.
A two column hero with a live webhook stream on the right, plus the same animation as a standalone integration.
Hero Section v2. Headline on the left and a live event stream on the right, staged in with a GSAP timeline on mount.
Event Stream. Standalone version of that animation. Three webhook events type out in sequence with an edge fade, frameless so it drops into any section.