saturation/ui
DocsComponentsBlocksPages

Sections

IntroductionComponentsInstallationTheming

Components

ComponentsAccordionAI Chat InputAlertAnimated GroupAnimated NumberAvatarBadgeBorder TrailBreadcrumbButtonButton GroupCalendar PickerCardChartCheckboxCollapsibleComboboxCommandContext MenuCredit CardData TableDate PickerDialogDropdown MenuEmptyFieldFiltersFull CalendarGlow EffectInputInput GroupInput OTPItemKanbanKbdMenubarNovel EditorPaginationProgressProgressive BlurRadio GroupSelectSeparatorSheetSkeletonSliderSonnerSpinnerSpotlightSwitchTableTabsText EffectText ShimmerTextareaToggleToggle GroupTreeTypography

Project Card

A card component for displaying project information with a gradient background and context menu.

Sypher Studios

Edited 9 months ago

Features

  • Hover animations — Subtle lift effect on hover
  • Dropdown menu — Quick actions via button
  • Context menu — Right-click for more options
  • Gradient backgrounds — Customizable color schemes

Variant: Text Overlay

A compact variant with text overlaid on the gradient background with a progressive blur effect.

Sypher Studios

Sypher Studios

Edited 9 months ago

With Animated Group

Display multiple project cards with staggered entrance animations.

Sypher Studios

Edited 9 months ago

Design System

Edited 2 weeks ago

Portfolio Site

Edited 1 month ago

E-commerce App

Edited 3 days ago

API Reference

PropTypeDefaultDescription
titlestring"Sypher Studios"Project title
timestring"9 months ago"Last edited time
gradientstring"from-purple-500 via-pink-500 to-orange-400"Gradient classes

Components Used

dropdown-menucontext-menu