design-infraGitHub
Report a problem or share feedback← Catalog

Features · Levels (scroll-spy)

curatedtheme-awarefree

oc/feature-levels

Multi-level feature walkthrough: two-tone headline, sticky numbered scroll-spy nav, large photo panels with floating glass product-UI cards (LevelCard), title + CTA per level. Free, theme-aware take on Aceternity's Pro multi-level-features block.

Catalog favoritescroll — subtledrop-inOrganicRefinedPremium
$npx shadcn@latest add @design-infra/feature-levels

npm deps: lucide-react

Our notes

♥ Free recreation of the Aceternity multi-level features block Owen loves — default pick for feature walkthroughs on landing pages.

Live demo — under each design system

brutalist-mono

Relay simplifies your AI infrastructure,
with one single connection.

const res = await fetch(
  "https://api.relay.dev/v1/chat", {
  method: "POST",
  body: JSON.stringify({
    model: "claude-sonnet",
    messages,
  }),
})

Use one API for every model

Point your existing code at Relay instead of each provider. Swap models by changing one string — no rewrite.

Book a call
gpt-5.5 down
claude-sonnet-4 rerouting
deepseek-chat

Stay online when providers fail

If a model goes down or rate-limits, Relay retries and routes traffic to the next provider. Users never see the failure.

Book a call
SuccessPOST /chatgpt-4o1.23s
SuccessPOST /chatclaude-40.91s
RetryPOST /chatgpt-4o2.40s

Balance load across providers

Spread traffic across models and regions automatically for better latency and cost.

Book a call

editorial

Relay simplifies your AI infrastructure,
with one single connection.

const res = await fetch(
  "https://api.relay.dev/v1/chat", {
  method: "POST",
  body: JSON.stringify({
    model: "claude-sonnet",
    messages,
  }),
})

Use one API for every model

Point your existing code at Relay instead of each provider. Swap models by changing one string — no rewrite.

Book a call
gpt-5.5 down
claude-sonnet-4 rerouting
deepseek-chat

Stay online when providers fail

If a model goes down or rate-limits, Relay retries and routes traffic to the next provider. Users never see the failure.

Book a call
SuccessPOST /chatgpt-4o1.23s
SuccessPOST /chatclaude-40.91s
RetryPOST /chatgpt-4o2.40s

Balance load across providers

Spread traffic across models and regions automatically for better latency and cost.

Book a call

linear-dark

Relay simplifies your AI infrastructure,
with one single connection.

const res = await fetch(
  "https://api.relay.dev/v1/chat", {
  method: "POST",
  body: JSON.stringify({
    model: "claude-sonnet",
    messages,
  }),
})

Use one API for every model

Point your existing code at Relay instead of each provider. Swap models by changing one string — no rewrite.

Book a call
gpt-5.5 down
claude-sonnet-4 rerouting
deepseek-chat

Stay online when providers fail

If a model goes down or rate-limits, Relay retries and routes traffic to the next provider. Users never see the failure.

Book a call
SuccessPOST /chatgpt-4o1.23s
SuccessPOST /chatclaude-40.91s
RetryPOST /chatgpt-4o2.40s

Balance load across providers

Spread traffic across models and regions automatically for better latency and cost.

Book a call

soft-glass

Relay simplifies your AI infrastructure,
with one single connection.

const res = await fetch(
  "https://api.relay.dev/v1/chat", {
  method: "POST",
  body: JSON.stringify({
    model: "claude-sonnet",
    messages,
  }),
})

Use one API for every model

Point your existing code at Relay instead of each provider. Swap models by changing one string — no rewrite.

Book a call
gpt-5.5 down
claude-sonnet-4 rerouting
deepseek-chat

Stay online when providers fail

If a model goes down or rate-limits, Relay retries and routes traffic to the next provider. Users never see the failure.

Book a call
SuccessPOST /chatgpt-4o1.23s
SuccessPOST /chatclaude-40.91s
RetryPOST /chatgpt-4o2.40s

Balance load across providers

Spread traffic across models and regions automatically for better latency and cost.

Book a call
Source
oc
Kind
block
Categories
features, scroll-effect
Use as
drop-in — replaces your component
Applies to
featuresscroll-effect
Motion
on scroll · subtle · js · low cost · ignores reduced motion
Tags
oc
Live demo
www.owencoonahan.xyz