Hyperblur terminal ver. 1.01002 items
hyperblur/
DocsEffectsComponentsBlocksTemplatesProAgents
GitHubSign inBrowse effects

Get started

  • Introduction
  • Installation
  • Agents
EffectsComponentsBlocks
All blocks

Hero sections50

  • Hero Section
  • Hero Dot Globe
  • Hero Dot Earth
  • Hero Dot Saturn
  • Hero Dot DNA
  • Hero Dot Orbit
  • Hero Dot Galaxy
  • Hero Dot Torus
  • Hero Dot Wave
  • Hero Dot Text
  • Hero Dot Logo
  • Hero Dot Silhouette
  • Hero Dot Worldmap
  • Hero Dot Brain
  • Hero Dot Head
  • Hero Dot Hand
  • Hero Scroll Expand
  • Hero Scroll Morph
  • Hero Scroll Horizontal
  • Hero Scroll Letters
  • Hero Scroll Curtain
  • Hero Scroll Stack
  • Hero Scroll Mask
  • Hero Scroll Ring
  • Hero Scroll Wipe
  • Hero Scroll Timeline
  • Hero Scroll Split
  • Hero Scroll Depth
  • Hero Prism
  • Hero Glass Orbs
  • Hero Stage Light
  • Hero Kinetic
  • Hero Devices
  • Hero Gradient Sphere
  • Hero Terminal
  • Hero Card Wall
  • Hero Live Metrics
  • Hero Aurora Lit
  • Hero Light Ribbon
  • Hero Swiss
  • Hero Editorial
  • Hero Orbs
  • Hero Prompt
  • Hero Spotlight
  • Hero Particles
  • Hero Beams
  • Hero Aurora
  • Hero Grid
  • Hero Product
  • Hero Type

Features12

  • Features Section
  • Features Sticky SwapNew
  • Features Live TabsNew
  • Features Hover RevealNew
  • Features Diagonal FlowNew
  • Features Mini UINew
  • Features Before AfterNew
  • Features Grid Glow
  • Features Alternating
  • Features Tabs
  • Features Checklist
  • Features Orbit

Bento12

  • Bento Live WidgetsNew
  • Bento Hero SatellitesNew
  • Bento Hover ExpandNew
  • Bento Scan SweepNew
  • Bento ShuffleNew
  • Bento Tilted PlaneNew
  • Bento Product
  • Bento Metrics
  • Bento Integrations
  • Bento Terminal
  • Bento Editorial
  • Bento Spotlight

Social proof12

  • Testimonials Section
  • Case Study Cards
  • Live Activity Proof
  • Proof Tilted WallNew
  • Proof Avatar OrbitNew
  • Proof Logo DockNew
  • Proof Video GridNew
  • Proof Review TickerNew
  • Proof Wall
  • Proof Spotlight Quote
  • Proof Logo Cloud
  • Proof Metrics Quotes

Contact9

  • Contact Booking Calendar
  • Contact Chat Widget
  • Contact Route MapNew
  • Contact Channel PickerNew
  • Contact Office PostcardsNew
  • Contact Split Form
  • Contact Offices
  • Contact Support Cards
  • Contact Minimal Light

Footers11

  • Footer Newsletter First
  • Footer App Download
  • Footer Reveal Under
  • Footer Pointer WordmarkNew
  • Footer Newsletter GroupsNew
  • Footer Single LineNew
  • Footer Sitemap StatusNew
  • Footer Mega
  • Footer Giant Wordmark
  • Footer CTA Sitemap
  • Footer Links Rail

Comparison6

  • Comparison Tiers
  • Comparison Scorecard
  • Comparison Calculator
  • Comparison Table
  • Comparison Versus
  • Comparison Slider

Navigation27

  • Nav Tab Bar
  • Nav App Header
  • Nav Side Dock
  • Navbar Prism Glass
  • Navbar Morph Underline
  • Navbar Magnetic
  • Navbar Spotlight
  • Navbar Scroll Shrink
  • Navbar Mega Preview
  • Navbar Command
  • Navbar Hamburger Morph
  • Navbar Banner Stories
  • Navbar Split Logo
  • Navbar Floating Capsule
  • Navbar Vertical Rail
  • Navbar Tabs Stretch
  • Navbar Search First
  • Navbar Bottom Notch
  • Navbar Commerce Rows
  • Navbar Theme Reveal
  • Navbar Hero Fill
  • Navbar Dock Stacks
  • Navbar Breadcrumb Switcher
  • Nav Mega Menu
  • Nav Floating Island
  • Nav Sidebar Mobile
  • Nav Announce Split

Cinematic pages14

  • Cinema Title Card
  • Cinema Trailer Slam
  • Cinema Credits Roll
  • Cinema Aperture Open
  • Cinema Light Leak
  • Cinema Projector Intro
  • Cinema Depth Fog
  • Cinema Split Reveal
  • Cinema Countdown Leader
  • Cinema Subtitles
  • Cinema Dolly Zoom
  • Cinema Chapter Select
  • Cinema Now Showing
  • Cinema Marquee Sign

Auth30

  • Login Card
  • Auth Tilt Spotlight
  • Auth Split Assemble
  • Auth Aurora Glass
  • Auth Passkey Handshake
  • Auth Magic Flight
  • Auth Social Orbit
  • Auth Status Rail
  • Auth Lock Reveal
  • Auth Flow OTP Verify
  • Auth Flow Reset Password
  • Auth Flow Two-Factor Setup
  • Auth Flow New Device
  • Auth Flow Signup Wizard
  • Auth Flow Lock Screen
  • Auth Flow Team Invite
  • Login Glass Card
  • Login Passkey
  • Login Social First
  • Login Minimal Line
  • Login Forgot Password
  • Login Reset Password
  • Login Two-Factor Choice
  • Login Account Chooser
  • Login Terminal
  • Login Onboarding Profile
  • Auth Split Brand
  • Auth Signup Steps
  • Auth OTP
  • Auth Magic Link

Call to action10

  • CTA Banner
  • CTA Rotating Band
  • CTA Sticky Dock
  • CTA Magnetic OrbNew
  • CTA Live Preview FormNew
  • CTA Benefit PlaneNew
  • CTA Terminal InstallNew
  • CTA Gradient Card
  • CTA Marquee Band
  • CTA Split Light

FAQ10

  • FAQ Section
  • FAQ Chat Thread
  • FAQ Flip Cards
  • FAQ Topic IconsNew
  • FAQ Scroll IndexNew
  • FAQ Branching ChatNew
  • FAQ Category DeckNew
  • FAQ Search
  • FAQ Two Column
  • FAQ Categories

Pricing17

  • Pricing Section
  • Pricing Seats Slider
  • Pricing Feature Table
  • Pricing Toggle Burst
  • Pricing Usage Calculator
  • Pricing Spotlight Grid
  • Pricing Matrix Sticky
  • Pricing Tier Carousel
  • Pricing Ribbon Highlight
  • Pricing Enterprise Contact
  • Pricing Credit Stack
  • Pricing Seat Stepper
  • Pricing Single Plan
  • Pricing Switch
  • Pricing Slider
  • Pricing Compare Cards
  • Pricing Credits

Stats11

  • Stats Mosaic
  • Stats Before After
  • Stats OdometerNew
  • Stats Scrub BandNew
  • Stats Arc GridNew
  • Stats VersusNew
  • Stats MilestonesNew
  • Stats Counters
  • Stats Bar Race
  • Stats Radial
  • Stats Ticker

404 pages8

  • 404 Maze
  • 404 Apology Letter
  • 404 OrbitNew
  • 404 Terminal ShellNew
  • 404 Glitch
  • 404 Astronaut
  • 404 Search
  • 404 Broken Plug

Profile8

  • Profile Settings Card
  • Profile Team Presence
  • Profile Resume Timeline
  • Profile Creator StatsNew
  • Profile Dev SkylineNew
  • Profile Header Card
  • Profile Creator Bio
  • Profile Dev Card

About9

  • About Team Filter
  • About Timeline Scroll
  • About Mission Split
  • About Press Wall
  • About Growth TimelineNew
  • About Values MotifsNew
  • About Team TimezonesNew
  • About Story
  • About Values

Waitlist8

  • Waitlist Inline Pill
  • Waitlist Referral Board
  • Waitlist Teaser Unlock
  • Waitlist Capacity Countdown
  • Waitlist Queue TicketNew
  • Waitlist Referral LadderNew
  • Waitlist: Live Counter
  • Waitlist: Launch Card

Showcase9

  • Showcase Bento Gallery
  • Showcase Before After
  • Showcase Device Tabs
  • Showcase Cursor PreviewNew
  • Showcase Case RailNew
  • Showcase Device GalleryNew
  • Showcase Browser
  • Showcase Device Stack
  • Showcase Marquee Cards

How it works9

  • Stepper With Screens
  • Dashed Path Steps
  • Steps CircuitNew
  • Steps Story TabsNew
  • Steps Scroll RulerNew
  • How It Works: Steps Line
  • How It Works: Sticky Scroll
  • How It Works: Vertical Timeline
  • How It Works: Flow Diagram

Download8

  • Download Changelog
  • Download Requirements
  • Download QR Handoff
  • Download OS HubNew
  • Download Version TableNew
  • Download: Platforms
  • Download: App Badges
  • Download: Install Tabs

Blog8

  • Newsletter Issue List
  • Blog Category Tiles
  • Blog Reading TimeNew
  • Blog Magazine GridNew
  • Blog Featured Grid
  • Blog List Editorial
  • Blog Article Header
  • Blog Carousel

Ecommerce9

  • Product Reviews
  • Category Mosaic
  • Order Tracking
  • Shop Spin ConfiguratorNew
  • Shop Filter ChipsNew
  • Shop Product Detail
  • Shop Cart Summary
  • Shop Collection Hero
  • Shop Checkout Steps

Checkout & billing10

  • Checkout One Page
  • Checkout Split Summary
  • Checkout Stepper Card
  • Checkout Mobile Sheet
  • Checkout Subscription Upgrade
  • Checkout Success Receipt
  • Checkout Payment Failed
  • Checkout Billing Settings
  • Checkout Invoice History
  • Checkout Pricing Modal

Local business8

  • Local Booking Card
  • Local Menu Board
  • Local Hours and Map
  • Local Team Grid
  • Local Services Price List
  • Local Reservation Bar
  • Local Before and After
  • Local Reviews Wall

Menus & ordering13

  • Menu Photo Rail
  • Menu Dietary Filter
  • Menu Specials Today
  • Menu Photo Cards
  • Menu Brunch List
  • Menu QR Table
  • Menu Drinks Cafe
  • Menu Tasting Courses
  • Menu Delivery Order
  • Menu Burger Board
  • Menu Pizza Sizes
  • Menu Chalkboard
  • Menu Combo Builder

hyperblur · visual effects for React

A software library of React UI components and code templates. Sample screens use placeholder content only.

TermsPrivacyRefundssupport@hyperblur.dev
Blocks/Menu Tasting Courses
984 / 1002

Menu Tasting Courses

A dark fine-dining tasting menu with numbered courses on a drawn gold line, wine pairings that light up when the pairing switch is on, and a per-person total with a guest stepper.

Halden

Seven courses for late autumn.

A single menu that follows the season, served at the counter facing the hearth. Allow about two and a half hours.

IMChef Ines Marlow · Tuesday to Saturday, seatings at 6:00 and 8:30

Per person$185/ guest
Wine pairingSeven glasses chosen by our sommelier, +$95
GuestsUp to 8 at the counter
2
Total before tax and service$370

Tell us about allergies when booking. A vegetarian menu is available with two days notice.

  1. 01

    Course 1 of 7

    Oyster, cucumber, dill

    Kumamoto oyster under a cold cucumber granita, dill oil and finger lime.

    Gluten-free

    Oysters arrive each morning from Hama Hama, Washington.

    Pairing: Pierre Péters, Blanc de Blancs, Champagne NV
  2. 02

    Course 2 of 7

    Beetroot, smoked cream, rye

    Salt-baked beets, whipped smoked crème fraîche, crisp rye and blackcurrant.

    Vegetarian

    Beets from Two Wolves Farm, roasted in salt for four hours.

    Pairing: Dönnhoff Riesling Kabinett, Nahe 2021
  3. 03

    Course 3 of 7

    Scallop, brown butter, celeriac

    Seared Hokkaido scallop, celeriac purée, hazelnut brown butter.

    Our most requested course since we opened in 2019.

    Pairing: Domaine Laroche, Chablis Premier Cru 2020
  4. 04

    Course 4 of 7

    Agnolotti, chestnut, sage

    Hand-pinched pasta filled with roasted chestnut, sage butter, aged parmesan.

    Vegetarian

    Rolled by hand an hour before service.

    Pairing: Benanti, Etna Bianco 2021
  5. 05

    Course 5 of 7

    Halibut, mussel beurre blanc

    Line-caught halibut, mussel and vermouth sauce, charred leek, trout roe.

    Gluten-freeNew this season
    Pairing: Domaine Vacheron, Sancerre 2022
  6. 06

    Course 6 of 7

    Dry-aged duck, plum, endive

    Fourteen-day aged duck breast, smoked plum, bitter endive, jus gras.

    Aged in-house on the bone, finished over binchotan.

    Pairing: Felton Road Pinot Noir, Central Otago 2019
  7. 07

    Course 7 of 7

    Pear, buckwheat, brown butter

    Poached Bosc pear, toasted buckwheat crumble, brown butter ice cream.

    Vegetarian
    Pairing: Royal Tokaji, Aszú 5 Puttonyos 2016

Install

terminal
npx shadcn@latest add https://hyperblur.dev/r/menu-tasting-courses.json

Works in any React project set up with the shadcn CLI. The file lands in components/hyperblur/menu-tasting-courses.tsx.

Use

example.tsx
import { MenuTastingCourses } from "@/components/hyperblur/menu-tasting-courses"

<MenuTastingCourses defaultPairing onSubmit={(r) => console.log(r.total)} />

Props

PropTypeDefaultDescription
restaurantstring"Halden"Restaurant name above the heading.
titlestring"Seven courses for late autumn."Heading. The last word is set in the accent color.
subtitlestring"A single menu that follows the season, ..."Paragraph under the heading.
chefstring"Chef Ines Marlow · Tuesday to Saturday, ..."Chef and seating line. Its initials fill the monogram.
courses{ name: string; description: string; pairing: string; note?: string; tags?: ("gf" | "vegetarian" | "new")[] }[]7 coursesCourses in order. The note expands on hover or focus.
pricenumber185Menu price per person in dollars.
pairingPricenumber95Pairing price per person, added when the switch is on.
pairingLabelstring"Wine pairing"Label of the pairing switch.
defaultPairingbooleanfalseWhether the pairing starts switched on.
defaultGuestsnumber2Initial number of guests.
maxGuestsnumber8Largest party the stepper allows.
accentstring"#c9a45c"Accent color used for highlights, selected states and buttons.
onSubmit(request: { guests: number; pairing: boolean; perPerson: number; total: number }) => voidCalled when Request this menu is pressed.
classNamestringExtra classes on the section root.
styleReact.CSSPropertiesInline styles on the section root.
PreviousMenu Drinks CafeNextMenu Delivery Order
Menu Drinks CafeMenu Delivery Order