SLARIVO / FEATURES

Features Components

Browse 224 exact locally owned demos. Filter the collection, inspect a focused preview, and unlock its implementation prompt.

• Slarivo Feature Section

  Feature Section A responsive and theme-adaptive component designed to showcase a product's key features. It includes a main title, a subtitle, a grid of features with icons, and a final call-to-action card. It's built to be highly reusable by accepting all content through props.

• Slarivo Feature 108

  A versatile section with 3 features inside a tabs component

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Feature Section with Bento Grid

  Feature section with Bento Grid, like product pics, YouTube videos, and a globe.

• Slarivo Feature Section

  Here are three lines you can use for this Featured Section: A clean two-column layout highlighting features with icons and descriptions on the left, and a smooth scrollable options list on the right. Designed with shadcn/ui cards, borders, and fade effects, ensuring both clarity and modern aesthetics. Perfect for showcasing key product highlights or services while keeping user engagement with continuous scrolling options.

• Slarivo Feature Section

  Feature Grid A responsive grid layout designed to showcase different product features, use cases, or categories. It includes a header with a title and illustration, a grid of categorized items with icons, and a call-to-action button. The component is animated using framer-motion to engage the user as they scroll.

• Slarivo Feature Section with Grid

  Feature Section with Grid

• Slarivo Feature Section

  A sleek, animated feature section showcasing steps with engaging visuals and smooth transitions. Features - Auto-advancing steps with progress - Smooth animations and transitions - Responsive design - Image carousel with transitions - Customizable timing and appearance - shadcn/ui theme integration - Progress indicators - Checkmark for completed steps

• Slarivo Features Section

  FeatureHighlights is a reusable React component system designed to showcase product features in a clean, responsive grid layout. Each feature includes a title, description, and icon, with hover animations and mobile-friendly styling. Ideal for landing pages, SaaS apps, or product intros.

• Slarivo Feature Spotlight

  Feature Spotlight A responsive section component designed to highlight a key product feature. It juxtaposes a detailed text description, including a pre-header, main heading, and call-to-action, with a dynamic visual element. The component includes subtle, continuous animations on floating images to draw user attention and add a modern feel. It is fully theme-adaptive, using shadcn/ui variables for colors and styling.

• Slarivo Feature Section with hover effects

  Feature Section with hover effects

• Slarivo Footer section

  Basic footer section with theme toggle

• Slarivo Features 8

  features section

• Slarivo Footer Section

  An animated footer section for saas website

• Slarivo Horizon Hero Section

  3d hero section component with interactive animations, 3d elements, parallax, post processing, scroll animation, and animated sidebar menu

• Slarivo Grid Feature Cards

  Minimal Features Section using Grid Feature Cards

• Slarivo Features 10

  features section

• Slarivo Feature Section with Bento Grid

  Feature Section with Bento Grid

• Slarivo Feature 197

  A versatile block with an Accordion that can switch between multiple features. Each feature has a heading, text and an image.

• Slarivo Feature with advantages

  Feature section with list of advantages

• Slarivo Section With Mockup

  responsive React component for displaying a section with text (title, description) and a styled image mockup. Features optional layout reversal and subtle scroll-triggered animations using framer-motion, including a parallax effect for the mockup and its background.

• Slarivo Feature Carousel

  Feature Carousel Interactive showcase for highlighting multiple app features in a swipeable, modern layout. Perfect for engaging users while promoting mobile-friendly tools and experiences.

• Slarivo Globe Feature Section

  The Featured_05 component is a modern hero section designed to spotlight Ruixen UI’s core value proposition. On the left, it presents a bold heading and supporting text that communicates the simplicity, scalability, and performance of the UI library. A prominent call-to-action button encourages users to engage immediately. On the right, a visually striking animated globe subtly anchors the section, reinforcing the product’s global relevance and modern aesthetic. The layout is fully responsive, ensuring that content and visuals remain balanced across devices.

• Slarivo Features

  Here is Features Component

• Slarivo Features

  Here is Features Component

• Slarivo Features

  Here is Features Component

• Slarivo Features

  Here is Features Component

• Slarivo Features

  Here is Features Component

• Slarivo Features

  Here is Features Component

• Slarivo Features

  Here is Features Component

• Slarivo Features 11

  Bento features section

• Slarivo Features 4

  features section

• Slarivo Features 6

  features section

• Slarivo Features 1

  features section

• Slarivo Features 2

  features section

• Slarivo Features 5

  features section

• Slarivo Features 7

  features section

• Slarivo Feature Comparison Table

  A pricing plan comparison table that lays out three plans side by side with grouped feature sections, check/value cells, a sticky header and a highlighted recommended column.

• Slarivo Bento Grid

  A skewed grid layout with Title, description and a header component

• Slarivo Sticky Scroll Reveal

  A sticky container that sticks while scrolling, text reveals on scroll

• Slarivo Feature with Image Comparison

  Feature block with Image Comparison

• Slarivo Integrations Component

  Here is Integrations Components

• Slarivo Features

  Here is Features Component

• Slarivo Features

  Here is Features Component

• Slarivo Features

  Here is Features Component

• Slarivo Bento Product Features

  Grids & Bento component from the 21st.dev community.

• Slarivo Blog 7

  Classic 3 card blog post layout, great for blog sections, featured blog posts and related blog posts. Uses shadcn/ui Card component

• Slarivo Cybernetic Bento Grid

  This is a modern and highly popular layout style for showcasing features, portfolio items, or key information. I've designed this one with a futuristic, cyberpunk aesthetic, featuring glowing borders that animate on hover, a subtle background grid, and a clean, dark theme.

• Slarivo Feature

  Badges component from the 21st.dev community.

• Slarivo Myna Hero

  Animated hero and navbar

• Slarivo Grid Card

  A stylish React + Tailwind CSS Grid Card component featuring animated background patterns and gradient effects. Ideal for dashboards, feature cards, pricing sections, and modern UI layouts.

• Slarivo Feature with Image Carousel

  Feature block with Image Carousel

• Slarivo Animated Feature Carousel

  An animated carousel component for showcasing features with smooth transitions and interactive elements

• Slarivo Feature Section with card gradient

  Feature Section with card gradient

• Slarivo Features 9

  features section

• Slarivo Ruixen Bento Cards

  Ruixen UI is built to make your job easier. These bento cards highlight what really matters when you're building modern UIs: beautiful components, smart layouts, performance, and flexibility. Whether you're working solo or with a team, Ruixen gives you a solid foundation that just works — clean code, great defaults, and the kind of polish that makes your product feel professional out of the box.

• Slarivo Sticky scroll cards section

  Sticky scroll cards section – React + Tailwind + Framer Motion

• Slarivo bento grid 01

  A reusable and responsive bento grid layout with animation

• Slarivo features

  A dynamic, scrollable feature showcase with auto-progress animation, * built using React, Framer Motion, and Tailwind CSS. * Highlights multiple features with icon support, images, and a visual progress indicator.

• Slarivo Feature Block Animated Card

  Feature Block Animated Card with logos

• Slarivo Animated Card Diagram

  Here is Animated Card Diagram component

• Slarivo Feature Showcase

  The FeatureShowcase component is a responsive, theme-aware section built entirely with shadcn/ui primitives that blends storytelling and interaction. It pairs an informative left panel—featuring a headline, description, subtle stats, step-by-step accordion, and clear call-to-action buttons—with a dynamic right panel that displays tab-based media. Each tab reveals a full-bleed image that automatically fills the container, making the layout visually balanced and immersive. Ideal for product introductions or feature highlights, this component lets designers combine concise narrative content with interactive visuals to engage users across light and dark themes.

• Slarivo How It Works

  How It Works Section Step-by-step process layout with icons and concise explanations. Guides users from query entry to store contact in a structured flow. Ideal for onboarding, tutorials, or service explanation pages.

• Slarivo Feature 1

  Basic Feature block with heading, description and buttons on left and image on right.

• Slarivo Gallery Hover Carousel

  This component is a dynamic, interactive gallery built with Shadcn UI and Tailwind CSS. Each card initially displays a full-background image, which smoothly shrinks to the top half on hover, revealing a text section with a title, subtitle, and arrow button. The layout is responsive, carousel-enabled, and visually engaging, perfect for showcasing content elegantly.

• Slarivo About

  Here is About section component

• Slarivo About

  Here is About section component

• Slarivo About

  Here is About section component

• Slarivo About

  Here is About section component

• Slarivo Feature with image

  Feature block with image and text

• Slarivo Feature Carousel

  An animated feature carousel with smooth slide transitions.

• Slarivo Category List

  An interactive and theme-adaptive list component used to display and navigate through different categories or features. Each item provides visual feedback on hover, revealing more details and an icon, making it ideal for guiding users through key sections of an application.

• Slarivo Combined Featured Section

  The combined section component serves as a spotlight area to showcase the core strengths or highlights of our platform. It brings together key offerings

• Slarivo Bento Grid

  A bento grid of cards with a feature card and smaller cards below. Minimal design and dotted backgrounds.

• Slarivo Pricing Cards

  A responsive pricing cards component with customizable tiers, features, and dark mode support. Features - Responsive grid layout (1 column on mobile, 2 columns on desktop) - Dark mode support - Customizable pricing tiers - Highlighted tier support - Animated hover effects - Feature list with included/excluded states - Customizable CTA buttons with link or click handler - Gradient backgrounds for highlighted tiers - Flexible styling through className props

• Slarivo Bounce card features

  BouncyCardsFeatures: Engaging Feature Showcase with Interactive Cards Showcase your product or service features in a fun and interactive way with BouncyCardsFeatures. This React component presents key selling points within visually appealing cards that "bounce" and rotate on hover, drawing attention and making your offerings stand out. Features Interactive Hover Effects: Each feature card reacts to user interaction with a subtle "bounce" and rotation on hover, creating a dynamic and engaging experience. Visually Distinctive Cards: The component uses a grid layout to arrange various sized cards, each with a vibrant, gradient-filled "feature demo" area that animates upwards and rotates on hover, emphasizing your product's capabilities. Clear Call to Action: A prominent headline immediately communicates your value proposition, complemented by a Learn more button that also includes subtle hover and tap animations. Responsive Grid Layout: The feature cards are arranged in a responsive grid that adapts gracefully to different screen sizes, ensuring optimal presentation on both mobile and desktop. Customizable Content: Easily populate each card with a title and integrate your own feature demos or descriptive content within the gradient-filled area. How it Works BouncyCardsFeatures leverages Framer Motion to deliver its smooth and playful animations: motion.div for Cards: The BounceCard component uses motion.div with whileHover props to apply the scaling and rotation effects when a user hovers over a card. CSS Transitions for Internal Elements: The FEATURE DEMO HERE element within each card uses standard CSS transitions to animate its translateY and rotate properties on the parent's group hover state, creating the distinct "pop-up" effect. This component is perfect for product pages, service descriptions, or any section where you want to highlight key features in an engaging, modern, and memorable way.

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Feature Sections

  Here is Feature Sections component

• Slarivo Animated Card

  Animated Card

• Slarivo Services Card

  Services Card – Showcase offerings. Modern UI component to present branding, development, or SEO services with clear visuals and descriptions. Ideal for portfolios and business websites.

• Slarivo Hero 45

  A hero section with 3 features underneath

• Slarivo Content Default

  Here is Content component

• Slarivo Content Default

  Here is Content component

• Slarivo Content Default

  Here is Content component

• Slarivo Content Default

  Here is Content component

• Slarivo Call to Action

  Here is Call to Action components

• Slarivo Bento

  Beautifully designed, fully responsive, expertly crafted Bento section

• Slarivo Ruixen Feature Section

  The Integrations component showcases key tools and platforms that seamlessly connect with our system to enhance productivity, collaboration, and performance. Each integration is represented with a distinct icon and a short description, helping users quickly identify the value each platform brings.

• Slarivo FeaturesDetail

  This FeaturesDetail component showcases product features through an animated, auto-sliding dashboard carousel with smooth GSAP transitions. It combines scroll-triggered effects and interactive tab navigation for a visually engaging feature preview.

• Slarivo Feature

  Sleek design animated Featured Cards Section

• Slarivo Bento Monochrome

  Here is Bento Monochrome component

• Slarivo Layer Parallax Hero

  Layer Parallax Hero

• Slarivo PARALLAX SCROLL FEATURE SECTION

  PARALLAX SCROLL FEATURE SECTION using framer motion

• Slarivo Colorful Bento Grid

  A section with live and coming soon pages to show on your landing page, no matter if you're a SaaS (show features) or an Agency.

• Slarivo Highlight Card

  Highlight Card shacn card

• Slarivo Featured Section Stats

  This component showcases a modern CRM/dashboard statistics section with a clean, responsive layout. It highlights key business metrics alongside a smooth blue-gradient area chart for visual impact.

• Slarivo Bento Grid

  Bento Grid, Bento

• Slarivo Bento Grid

  Grids & Bento component from the 21st.dev community.

• Slarivo Interactive Scrolling Story Component

  This React component creates an immersive, full-page scrolling animation designed to showcase a series of features or messages. As the user scrolls down, the content on the left smoothly transitions with a fade and slide effect, while the corresponding image on the right slides into view.

• Slarivo Stats Section with Text

  Statistics Section with Text

• Slarivo Scroll Card

  Here is scrolling stacking card

• Slarivo Pricing With Chart

  a modern pricing section with free and pro plans, featuring feature lists, call-to-action buttons, and an interactive chart for plan popularity trends. Perfect for SaaS websites, subscription platforms, and business landing pages.

• Slarivo Feature Card

  Animated Feature Card This component displays a feature or benefit in a visually engaging card format. It's designed to be highly reusable, accepting props for its content, image, and color theme. The hover animation, powered by framer-motion, adds a delightful interactive element.

• Slarivo Feature Carousel

  Here is modern feature carousel component

• Slarivo Spotlight Card

  A modern, interactive card component featuring a mouse-following gradient spotlight effect. Perfect for highlighting features, bento grids, and dark-themed interfaces.

• Slarivo Service Card

  Service Card A visually engaging card component designed to showcase services or features. It includes a title, a call-to-action link, and a decorative image. The card features a subtle, fluid animation on hover to draw user attention.

• Slarivo Bot Detection

  Here is Bot Detection component

• Slarivo Featured Image Section

  This feature section highlights Ruixen’s core strengths with an interactive tab layout. Each tab showcases a unique capability—like a user-friendly dashboard, smart keyword generation, and one-click SEO optimization. Designed with clean visuals and intuitive icons, it helps users quickly understand Ruixen’s value.

• Slarivo Color Change Card

  This is an animated card component that uses framer motion and has a color-changing animation on hover. Use for feature sections.

• Slarivo Feature 72

  A grid of feature cards

• Slarivo Features

  Profiles component from the 21st.dev community.

• Slarivo Spotlight Card

  Create a spotlight effect on hover on a card component.

• Slarivo Feature 2

  Basic feature section with heading, description and buttons. Image on left

• Slarivo How We Do It - Process Overview

  How We Do It – Agile-driven process overview. Displays each stage from ideation to launch using bold cards and icons. Each block outlines a key phase (e.g., Brainstorming, QA, Release). Ideal for explaining workflow clearly and visually.

• Slarivo Single Pricing Card

  A super clean single pricing card with features and testimonials.

• Slarivo Services

  I crafted this services section to clearly showcase what the business offers, making it easy for visitors to understand our value at a glance.

• Slarivo Feature Modern

  Here is Feature component

• Slarivo Feature Modern

  Here is Feature component

• Slarivo Feature Modern

  Here is Feature component

• Slarivo Feature Modern

  Here is Feature component

• Slarivo Feature Modern

  Here is Feature component

• Slarivo Feature Modern

  Here is Feature component

• Slarivo Feature Modern

  Here is Feature component

• Slarivo Feature Modern

  Here is Feature component

• Slarivo About Page

  This AboutPage component is a fully responsive, visually engaging section designed to highlight a company’s ecosystem, achievements, and core offerings. The top hero section features a large, rounded hero image with a bold headline and supporting text, emphasizing the company’s ecosystem and its products, models, and platforms. Below it, the About section introduces the team and mission, followed by a three-column layout: a large main image on the left and two vertically stacked cards on the right. The first card showcases detailed content with a dark background, a top image with a gradient fade, a descriptive headline, explanatory text, and a call-to-action button. The second card complements it with a colorful image and a brief text overlay. Both cards scale up slightly on hover, adding interactivity, while gradient overlays ensure readability. The layout is fully responsive, adapting to smaller screens by stacking the cards vertically, and it supports dark and light themes, maintaining contrast and visual clarity across modes. Overall, it balances aesthetics, interactivity, and information hierarchy to create a modern “About Us” page that engages users and communicates value effectively.

• Slarivo Card with Ellipsis Pattern

  A versatile card component featuring an elegant ellipsis dot pattern background and gradient overlay. The distinctive dot pattern creates a subtle yet engaging visual texture, making it perfect for feature highlights, pricing cards, or any content that needs sophisticated visual emphasis. Features - Elegant ellipsis dot pattern background - Distinct patterns for dark/light modes - Smooth gradient overlay for better text readability - Responsive design - Dark/Light mode support with different dot colors - Built with shadcn/ui theme system - Framer Motion entrance animation

• Slarivo Integration Showcase

  Integration Showcase This component displays a title, subtitle, an illustration, and a responsive grid of integrations. It's designed to be easily populated with your own data.

• Slarivo Security Card

  Here is Security Card component

• Slarivo Hero

  Heroes component from the 21st.dev community.

• Slarivo Gradient Card

  Gradient Card This component is a flexible card with a status badge, title, description, call-to-action link, and a decorative background image. The gradients, colors, and content are all controlled via props to ensure maximum reusability.

• Slarivo Feature Highlight Card

  Feature Highlight Card This component, FeatureHighlightCard, is designed to showcase a specific feature, complete with an image, title, description, and a call-to-action button. It uses framer-motion for smooth, staggered animations and is styled with shadcn/ui theme variables to ensure it adapts to both light and dark modes.

• Slarivo FinTech Landing Page

  A modern minimal landing page for Fintech startups.

• Slarivo Bento Monochrome 1

  Here is Bento Monochrome 1 componehnt

• Slarivo hero-section

  Animated Blocks Hero

• Slarivo Feature Grid

  Feature Grid A responsive grid component designed to showcase a list of features or services. Each item in the grid consists of an image, a title, and a description, presented in a clean, card-like format. It's fully responsive, theme-adaptive, and includes a subtle animation on hover to enhance user interaction.

• Slarivo Magnified Bento

  A bento grid with magnification effect on hover.

• Slarivo Dark Grid

  Here is Dark Grid component

• Slarivo Bento Grid

  All-in-one tools for automation, content management, scheduling, and AI-powered efficiency.

• Slarivo Hero

  Heroes component from the 21st.dev community.

• Slarivo Feature 73

  Feature cards in grid layout with Featured card at the top.

• Slarivo Bento Features

  Here is Bento Features componhent

• Slarivo Feature Card

  Feature Card

• Slarivo Features 3

  features section with chained cards

• Slarivo Feature Accordion Section

  This component provides an interactive and visually engaging way to present key features in an organized layout. The left section highlights important items with clear icons, images, and counts, while an accordion ensures that detailed information can be expanded or collapsed as needed.

• Slarivo Yield Card

  A sleek, modern card component featuring a gradient border effect and analytics icon, perfect for your applications. The component showcases mutual funds return with a dark theme, golden accents, and smooth gradient borders. Built with Tailwind CSS for easy customization and includes an animated chart SVG icon.

• Slarivo Download Options Section

  Download Options Section – Platform-agnostic access panel. Clearly showcases download paths for Mac, Windows, Mobile, and Browser Extension. Designed with strong CTAs and responsive layout. Ideal for onboarding users across ecosystems.

• Slarivo Feature Card

  feature card animated card

• Slarivo Framework Agnostic

  Here is Framework Agnostic component

• Slarivo Kinetic ShatterBox Section

  A physics-driven container blending neo-brutalist aesthetics with gamified destruction. Implements drag-to-shake mechanics and procedural debris generation, allowing users to shatter the interface and reveal its underlying "skeleton" before a seamless self-repair cycle restores it.

• Slarivo Feature Card

  Feature Card A versatile, theme-adaptive card component with built-in animations to showcase product features elegantly.

• Slarivo Service Grid

  ServiceGrid A responsive grid component designed to showcase a list of services or features. Each item in the grid consists of an image and a title. The component features a staggered fade-in animation for the grid items and a subtle hover effect, all while being fully theme-adaptive using shadcn/ui CSS variables.

• Slarivo Cards Grid

  Resource Cards Grid A responsive grid of cards, perfect for displaying links to key resource sections like documentation, contracts, or policies. Each card features an icon, title, update timestamp, and a clear call-to-action arrow. The grid uses framer-motion for smooth, staggered loading animations and hover effects.

• Slarivo Us vs Them Comparison

  A two-column "Us vs. Them" comparison section with side-by-side cards — one listing product advantages with check rows and a primary CTA, the other listing competitor pain points with cross rows.

• Slarivo Terminal Control Section Animated

  Terminal Control Section Animated. Responsive, accessible UI with animated tabs and a code-diff preview powered by Framer Motion.

• Slarivo BentoItem

  A React UI component that adds a 3D tilt-and-scale hover effect to any child element, perfect for building interactive bento-style grids.

• Slarivo FeatureGrid – Enterprise-Grade

  “Stop burying your features in walls of text. The FeatureGrid gives you a beautiful, responsive, and accessible card grid to showcase your product’s superpowers. With icon + title + description support, built-in hover/focus interactions, dark mode compatibility, and theme-aware design, it’s perfect for SaaS landing pages, dashboards, or enterprise websites. Just pass an array of features, and get a Fortune-500-ready grid out of the box.” ⚡ Why this works: Pain-point hook: “Stop burying your features in walls of text.” Promise: “Beautiful, responsive, accessible card grid.” Feature highlights: Icons, hover/focus, dark mode, shadcn theme. Credibility boost: “Fortune-500-ready” → makes it aspirational + premium. Use cases: SaaS landing pages, dashboards, enterprise websites.

• Slarivo Content Block

  Here is Content Block component

• Slarivo Content Block

  Here is Content Block component

• Slarivo Content Block

  Here is Content Block component

• Slarivo Content Block

  Here is Content Block component

• Slarivo StackFlow Integrator

  Glassmorphic, diamond-layout tech-stack showcase with subtle hover motion—drop-in, dual-mode, zero config.

• Slarivo Special Card

  Here is Special Card component

• Slarivo Bioluminescent Grid

  An interactive grid layout where items emit a futuristic, organic glow and an animated border that tracks the user's mouse movement.

• Slarivo Glow Hero Section

  A responsive, futuristic hero section featuring an interactive animated background with support for both light and dark themes.

• Slarivo Testimonial Card

  Testimonial Card This component, TestimonialCard, is designed to be a flexible and reusable element for displaying reviews and features. It accepts props for all dynamic content, including testimonials, features, ratings, and even the header logo, making it highly adaptable for different use cases beyond just Trustpilot.

• Slarivo Scroll Reveal

  Elements animate into view when they enter the viewport. Supports any Motion variant, configurable thresholds, and a once-only mode.

• Slarivo Scroll Reveal

  Elements animate into view when they enter the viewport. Supports any Motion variant, configurable thresholds, and a once-only mode.

• Slarivo Subscription Screen

  Subscription Screen A responsive, theme-adaptive subscription screen component designed to present pricing plans and key features in a visually appealing layout. It includes built-in animations and is structured for easy customization through props.

• Slarivo Product Feature Card

  Product Feature Card A visually polished card component with hover and load-in animations to showcase a product or feature.

• Slarivo RuixenCard-01

  The RUIXEN UI Feature Card is a compact yet elegant component designed to showcase products, blog posts, or UI elements with visual clarity. It features a responsive image with a soft-glass background overlay, a vibrant badge for status or category, and a clean content area with a title, subtitle, and interactive arrow icon. On hover, the inner content subtly lifts and scales, enhancing interactivity without overwhelming the layout. This card is perfect for dashboards, landing pages, and marketing sites looking to present information with style and motion.

• Slarivo App Download Section

  App Download Section This component provides a promotional section to encourage users to download an application. It features a QR code, a list of benefits, and a prominent visual element, all of which are fully customizable through props.

• Slarivo Feature Highlight Pro Card

  The Floating FeatureHighlightCard is a modern, animated UI component crafted with Framer Motion, TypeScript, and Tailwind CSS to deliver an engaging visual experience. Its standout element—a smoothly floating image—adds a sense of motion and liveliness, perfect for showcasing products, gifts, or key features. Designed with ultra-rounded corners, a soft glow background, and subtle fade-and-rise transitions, this card feels both premium and playful. It’s fully responsive, theming-friendly with Shadcn UI, and optimized for reusability across landing pages, marketing sections, or dashboard highlights. The floating motion speed and amplitude are easily customizable, making it adaptable for any design aesthetic.

• Slarivo Hero Section

  A visually polished 2D wave that brings a webpage to life. It supports light and dark themes and features dramatic, multi-point lighting.

• Slarivo Animated Feature Card

  Animated Feature Card A visually polished card component that uses framer-motion for a subtle load-in animation and hover effect. It's designed to be highly reusable for showcasing features or portfolio items.

• Slarivo How It Works

  A visual step-by-step process section with pinned, connected cards showing how something works.

• Slarivo Shine Border Feature Card

  An interactive mouse-tracking spotlight border that reveals a gradient glow on hover, wrapping a feature highlight card.

• Slarivo Multi-Platform Download Grid

  A responsive download section with cards for every platform — iOS, Android, web, desktop, and browser extensions — so users can quickly grab the right app.

• Slarivo Integrations Card Grid

  A marketing section that showcases third-party integrations as a responsive grid of logo cards with title and description.

• Slarivo Scroll Reveal

  A wrapper component that animates its children into view when they enter the viewport, with configurable Motion variants, thresholds, and a once-only mode.

• Slarivo Feature Bento

  A responsive bento-grid feature section with a hero card, stat tiles, and CTA blocks for product landing pages.

• Slarivo Features Grid

  A responsive grid of product feature cards with icons, titles and descriptions for landing page sections.

• Slarivo settings

  here is modern settings component

• Slarivo Card

  Interactive Card A visually engaging card component that features an icon group with hover animations, a step indicator, title, and description. It's designed to be reusable and adapt seamlessly to light and dark themes.

• Slarivo Download 01

  Download plugins and software with logos

• Slarivo Scroll 01

  A scroll-driven section with sticky media on one side that swaps images as the reader scrolls through the accompanying text content.

• Slarivo Feature Velocity

  Bold marketing feature section with an uppercase headline and hover-glow gradient cards that highlight product capabilities.

• Slarivo UltraQualityShowcaseGrid

  A never-before-seen, high-impact React feature showcase grid built with Tailwind CSS and Framer Motion. It delivers a mosaic layout with one large hero card and multiple supporting cards, each with interactive 3D-tilt hover effects, animated badges, and responsive parallax backgrounds.

• Slarivo Features Card

  Stats & KPIs component from the 21st.dev community.

• Slarivo featuresgrid

  Features component from the 21st.dev community.

• Slarivo Integrations Section

  Marketing section that showcases app integrations as a grid of branded logo cards next to a headline and call-to-action.

• Slarivo Feature Hero

  A centered hero section with heading, subtext, and a grid of icon-based feature cards highlighting product capabilities.

• Slarivo Comparison Slider with Highlights

  Split-layout before/after image comparison slider with a draggable divider and a sidebar of feature highlights and icons.

• Slarivo How It Works Steps

  A three-step "how it works" section with numbered, icon-badged cards explaining a process from setup to results.

• Slarivo Feature 01

  Features with cards and image

• Slarivo Benefit Showcases

  A lightweight, animated React section that presents a headline, subtitle, and a responsive grid of benefit cards with accessible SVG icons and staggered entrance animations.

• Slarivo Standard Card

  The card is a 3D-tilt interactive card component built with Framer Motion. It responds to mouse movement by rotating on its X and Y axes, creating a depth illusion. Each card features an icon, title, description, and an animated "Discover More" arrow link. On hover, the icon inverts to black-on-white, an underline animates in, and a soft shadow blooms beneath the card.

• Slarivo Feature Service Section

  A marketing services section pairing a headline and CTA with a grid of icon service cards, one highlighted as active.

• Slarivo 3D Feature Cards

  Features of this Component 3D Interactive Card System: Cards rotate based on mouse position for a realistic 3D effect Perspective transforms create depth and immersion Advanced Animation Effects: Smooth transitions between active states Floating background elements create depth Gradient pulse animations add visual interest Progress bar animations for active cards Responsive Design: Adapts from single column on mobile to 4-column grid on large screens Maintains visual impact at all screen sizes Modern UI Elements: Glassmorphism with backdrop blur effects Gradient highlights and shadows Micro-interactions on hover and click Auto-advancing Carousel: Cards automatically cycle every 5 seconds Manual control via indicator dots and card clicking To use this component, you'll need to: Install Framer Motion: npm install framer-motion Include the additional CSS or convert it to Tailwind classes Import the component into your React application This design provides a premium, cutting-edge look that combines modern UI trends with thoughtful interactions and animations.

• Slarivo Modal Card

  modern modal card

• Slarivo Impact-section

  Stats & KPIs component from the 21st.dev community.

• Slarivo Integrations Grid

  A split section with a heading and a masked grid of scattered rounded cards displaying integration logos.

• Slarivo Scroll Reveal Content A

  A scroll-driven section that reveals three numbered content blocks with a growing vertical progress line and synchronized image transitions as the user scrolls.

• Slarivo Stacking Cards

  Cards pin to the top and scale down as subsequent cards scroll underneath, creating a layered stacking effect.

• Slarivo Core Features

  highly reusable and is styled with Tailwind CSS for a modern look. For icons, I'm using lucide-react, a very popular and lightweight icon library. Everything is bundled into a single file so you can easily drop it into any React project.

• Slarivo Alternating Features Section

  A features section with alternating side-by-side rows pairing headings and descriptions with images, animated into view on scroll.

• Slarivo Binaural Glow Feature Card

  Tarjeta de características para Next.js y Tailwind CSS con animación de luz binaural fluida en el borde, optimizada para dashboards y landing pages en modo oscuro.

• Slarivo Squeeze Carousel

  An expanding accordion image carousel: one wide hero panel, the rest squeezed into thin clickable strips. Smooth width animation, click-to-open, hover grow, autoplay, keyboard control, responsive, light and dark mode. Perfect for product features.

• Slarivo Feature Overview Bento

  A bento-grid feature section that mixes a customer quote with avatar, two metric tiles, a product-update card with an action button, and a checklist of steps, all laid out on a hairline grid.

• Slarivo Feature Tab Switcher

  A vertical tab list that switches a side panel between three feature previews, such as conversation assignment, saved replies and snooze scheduling in a shared inbox.

• Slarivo Path to Resilience Partnership Section

  A partnership section for AI and digital service teams building durable capability.

• Slarivo Bento Grid Hero

  A three-tile asymmetric bento grid section with a wide hero tile featuring a headline and CTA button above two feature tiles with icons, used for landing page feature highlights.

• Slarivo Bento Feature Grid

  A 2x2 grid section of feature tiles, each with an icon, heading, and short description, used to highlight product pillars on a landing page.

• Slarivo Comparison Section

  A before-and-after comparison section that shows a struck-through list of old-way pain points beside a checked list of improvements, closing with an outcome stats strip and call-to-action button.

• Slarivo Feature Grid Spotlight Cards

  A six-card feature grid with hairline dividers, icon tiles, corner crosshair marks, and a radial spotlight that follows the pointer on hover, used to showcase a product's key capabilities.

• Slarivo Feature Problem Cards

  A problem-framing feature section with a badge and serif headline above three animated cards, each showing an icon in a glowing orb with a title and short description.

• Slarivo Halo Reel

  Image cards riding an ellipse. cos θ places each card, sizes it and stacks it, so the near side of the ring is large and the far side small - one number, three properties, always in agreement. It turns on its own, and you can drag it.

• Slarivo Alqemist Security

  Alqemist enterprise security block with interactive controls for isolation, credentials, auditability, and self-hosting.

• Slarivo Alqemist Interactive Demo

  Interactive Alqemist product demo block showing projects, agents, integrations, scheduling, and security surfaces.