---
title: "Curvy Showcase — Free Framer component · Best of Framer"
description: "Free Framer component · by BuiltByKern · Cards. Kern Curvy Showcase turns a project list into a kinetic studio ribbon."
canonical: "https://framer.elliotli.dev/component/curvy-showcase"
---

[Home](/)/[Components](/components)/[Cards](/components/category/cards)/Curvy Showcase

# Curvy Showcase

Bowl ribbon portfolio showcase

[View on Framer](https://framer.com/marketplace/components/curvy-showcase/?via=elliot-li)

![Curvy Showcase preview image 1](https://framer.elliotli.dev/og/component/curvy-showcase/e5d4a37c2864a36d/1600x1054.jpg)

## Summary

Kern Curvy Showcase turns a project list into a kinetic studio ribbon.

## Description

**Kern Curvy Showcase** turns a project list into a kinetic studio ribbon. Scroll inside the stage—cards sit on a concave bowl arc (taller center, softer edges), snap to center, and expand into a fullscreen case-study view with editorial typography.

**Ribbon & scroll** Self-contained stage—no page pin. Wheel anywhere on the stage; **drag and grab only on project cards** (same hit area as hover cursor and click-to-expand). Idle snap magnet pulls to the nearest card after you stop scrolling. Tune speed, magnet delay, and settle ease.

**Bowl motion** **Intensity** controls arc height and scroll kinetic depth. **Focus Depth** scales the bowl peak, side fade, and 3D tilt. Set either to zero for a flat horizontal row.

**Expand** Click a card or let the ribbon settle after scroll to expand. Spring choreography opens the active image while neighbors fade. Title reveals character-by-character; subtitle, description, tags, and year enter on stagger. Scroll or tap to collapse via the **Close** cursor chip.

**Typography & UI** Optional `mix-blend-mode: difference` keeps white type readable over photography—toggle off for solid copy on any background. Three font slots (title, meta, body) plus title size caps for tablet and mobile.

**Custom cursor** Optional project cursor: dot + project name **only when hovering a card**; **Close** label when expanded. Offset slider in Interaction.

**Appearance** Warm paper default, stage grain, edge vignette, and 3D perspective distance for bowl wave and expand.

**Production guardrails** Static canvas preview, `prefers-reduced-motion` horizontal scroll-snap fallback, in-view motion gate, semantic region label, transform-first animation, zero external dependencies.

Bind a CMS collection to **Projects**, map image and text fields, tune Motion and Appearance, preview in **published** mode. Built brutally well by KERN.

### Tags (Marketplace)

Framer, Component, Portfolio, Scroll, Carousel, Ribbon, Cinematic, Typography, Motion, Gallery, Showcase, Responsive, Accessible, Code Component, Studio, Agency, Bowl, Expand

## Rank history [How rankings work →](/terms#rankings)

-   All · #1470

## Details

- **Author**: BuiltByKern
- **Published**: 2026-06-25
- **Updated**: 2026-09-11
- **Added**: 2026-06-25
- **Categories**: Cards

## More like this

-   [BlogX Blog Card](/component/blogx-blog-card) — Themomarket · $8 — Blog Framer Component
-   [FluxPrice](/component/fluxprice) — Jeshan Athulesh · $49 — Elevate your SaaS conversion rate in minutes with FluxPrice.
-   [Feature Ribbon Cards](/component/feature-ribbon-cards) — Studio Digital · Free — Interactive image feature cards
-   [Dynamic Pricing Calc](/component/dynamic-pricing-calc) — Dmitry Vorobey · $12 — Pricing cards with live calculator