SLARIVO / TEAM SECTIONS
Team Sections Components
Browse 101 exact locally owned demos. Filter the collection, inspect a focused preview, and unlock its implementation prompt.
- Slarivo Team Section
TeamSection A responsive team showcase section with member profiles, designations, social media links, and an animated hover effect for individual member cards.
- Slarivo Team
Team Sections component from the 21st.dev community.
- Slarivo Team Section
Team section showcasing staff members with multiple scroll animations.
- Slarivo Team Section
Animated Team Section This component displays a title, a description, and a list of team members in a visually appealing animated arc layout. It's designed to be highly reusable through props.
- Slarivo Team Section Block
Animated team member cards with avatars, roles, and social links
- Slarivo Team
Here is Team component
- Slarivo Feature Sections
Here is Feature Sections component
- Slarivo Team Showcase
A magazine-style team section featuring a three-column staggered photo grid paired with an interactive member list. Photos default to grayscale; hovering a photo or a name entry simultaneously reveals the portrait in full color and highlights the corresponding name row. Includes social link icons (X, LinkedIn) that animate in on row hover.
- Slarivo Hero Section
Here is Hero Section component
- Slarivo about section 2
Professional about section components featuring company stories, team showcases, mission statements, and brand narratives with elegant animations and responsive layouts
- Slarivo Animated Tooltip
A cool tooltip that reveals on hover, follows mouse pointer Features: - Mouse Following: The tooltip moves and rotates with your cursor. - Spring Animation: Enjoy smooth, springy animations for a natural feel. - Hover Effects: Tooltips pop up with fade and scale effects when you hover. - Avatar Display: Circular profile pics with a stylish border. - Gradient Accents: Cool gradient lines add flair to the tooltip. - Group Layout: Stack avatars for a neat overlapping look. - Responsive Images: Next.js Image takes care of loading and optimizing images. Example Use Cases: - Team Member Display: Show team info when you hover. - User Lists: Highlight user details in social features. - Contributor Sections: Feature project contributors. - Member Grids: Showcase community or organization members. Props: - id: A unique identifier. - name: The display name. - designation: The role or title. - image: The avatar image URL.
- Slarivo About Section
Professional about section components featuring company stories, team showcases, mission statements, and brand narratives with elegant animations and responsive layouts
- Slarivo Team
Here is Team component
- Slarivo Server Management Table
This server management table component is ideal for cloud service providers and IT administrators who need to monitor and control multiple servers across different geographical locations. It could be integrated into web-based admin dashboards for hosting companies, enterprise server management systems, or DevOps monitoring platforms where users need real-time visibility of server performance and status. The interactive controls allow operators to efficiently manage server lifecycle operations like starting, stopping, pausing, and restarting services with a clean, responsive interface that works well in both light and dark themes.
- Slarivo About 3
An About Us Landing page with breakout images, logos and stats about your company and team.
- Slarivo RuixenContributorsTable
a comprehensive overview of RUIXEN’s open-source projects, teams, and contributors. Designed for maintainers and team leads, it offers dynamic column selection, real-time filtering by project status and technology, and contributor tooltips with role and contact details. Users can customize their view to focus on specific data points—such as project timelines, technologies used, or team compositions—making it easy to manage internal development efforts or showcase team contributions publicly. The interface is clean, responsive, and optimized for both quick scanning and deep inspection.
- Slarivo Workspaces
a flexible, context-based solution to manage and display multiple workspaces in your app. It uses Radix Popover, supports avatars, search, and customizable rendering—perfect for SaaS dashboards with multi-tenant support.
- Slarivo Workspaces
a flexible, context-based solution to manage and display multiple workspaces in your app. It uses Radix Popover, supports avatars, search, and customizable rendering—perfect for SaaS dashboards with multi-tenant support.
- Slarivo Lets Work Section
A minimal, standout "Let's Work Together" component with a hover effect and smooth micro-interactions
- Slarivo About
Here is About section component
- Slarivo Hero Section
Here is Hero section components
- Slarivo Avatar Circles
Overlapping circles of avatars.
- Slarivo 3D Hero Section Boxes
3D Hero Section With Animated Boxes
- Slarivo flow-gradient-heroSection
An authoritative UI component featuring fluid liquid gradients and kinetic typography. Designed for premium dark-mode experiences, it combines a sophisticated grainy texture with bold messaging that commands attention. This section captures a modern, leadership-focused aesthetic, ideal for high-stakes tech brands or creative agencies looking for a "smart," professional edge.
- Slarivo Integrations Section
This component is a hero section for RUIXEN UI that introduces the product with a clear heading, supporting text, and call-to-action buttons.
- 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 Avatar Group
An avatar group component made with framer-motion and Tailwind CSS
- Slarivo Avatar
Enchanced shadcn/ui avatar
- Slarivo Avatar
An image element with a fallback for representing the user.
- Slarivo Card
Containers for displaying content and actions about a single subject.
- Slarivo Empty
Here is Empty components
- 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 Avatar Group
A component that displays a group of avatars.
- Slarivo Team Invitation
Team Invitation notification
- Slarivo Profile Card
A responsive, production-ready team or leader profile card for Next.js, featuring a prominent photo, bio, and social links. Built with Tailwind CSS, Framer Motion, Lucide React icons, and Next.js best practices, it supports both light and dark themes out of the box.
- Slarivo SidebarShowcase
This custom sidebar component is a fully responsive, interactive navigation panel built using ShadCN UI, Framer Motion, and React. It features a team switcher at the top, allowing users to quickly toggle between different teams using a dropdown menu. The sidebar is divided into categories such as “Main” and “Work,” where each category contains individual navigation items. The Work category supports collapsible sub-labels with smooth animations for nested items, while some items can remain as single links without dropdowns. Each navigation item can display a status badge (like “New,” “Updated,” or “Coming Soon”) to indicate priority or updates. At the bottom, the sidebar includes a user profile dropdown with options for profile management, settings, billing, and logout, fully leveraging ShadCN UI’s DropdownMenu. The component combines clean typography, muted default text, hover effects, and smooth motion animations, offering a polished and professional navigation experience suitable for modern web applications.
- Slarivo About Section
Professional about section components featuring company stories, team showcases, mission statements, and brand narratives with elegant animations and responsive layouts
- Slarivo Dashboard
Marketing Dashboard Description: An animated dashboard card to display marketing activities and team statistics. It features a main header, two distinct stat cards, and a call-to-action banner. The component uses framer-motion for smooth, engaging animations on load and hover.
- Slarivo Scroll Area
Augments native scroll functionality for custom, cross-browser styling.
- Slarivo Member Selector
Team Sections component from the 21st.dev community.
- Slarivo Basic Avatar
Here is Avatar component
- Slarivo ContributorsOverviewTable
The ContributorsOverviewTable component presents a clean, structured, and interactive summary of contributors within a team or project. Designed for clarity and ease of use, this table highlights essential details like contributor names, email addresses, geographic locations, account status, and individual payout balances. Visual cues such as colored status badges enhance readability, while responsive hover states provide a polished user experience
- Slarivo Kinetic Team Hybrid
A responsive, Framer Motion–powered team roster featuring a global cursor-follow preview on desktop and tap-to-expand accordion images on mobile for a cinematic talent showcase.
- Slarivo Card Studio
Here is Card component
- Slarivo Avatar
Avatars represent a user or a team. Stacked avatars represent a group of people
- Slarivo Team Member Card
An animated team member card with hover effects revealing social links and role details.
- Slarivo Team Showcase
Team Showcase A responsive and animated component to showcase team members or featured profiles in a visually engaging, overlapping card layout. It features staggered entrance animations for the cards and subtle hover effects.
- Slarivo Tree
Here is Tree component
- Slarivo Orbiting Avatars
Orbiting Avatars CTA Description: A visually engaging Call-to-Action (CTA) component that displays a central message, a button, and a configurable set of avatars that gently float and orbit around the content. It's designed to highlight community, contributors, or users in a dynamic way.
- Slarivo Avatar Smart Group
The Avatar Smart Group component is a versatile and reusable UI element designed to elegantly display a group of user profile images with interactive tooltips. It supports two layout variants — uniform, where all avatars are equal in size, and centered, where the middle avatar is highlighted to draw focus. Each avatar includes hover animations, smooth scaling effects, and customizable features such as size, overlap spacing, ring color, tooltip background, and hover scale intensity. Built with React and Tailwind CSS, it maintains a clean aesthetic while remaining highly configurable for any project — from team displays and contributor sections to community dashboards or collaboration tools. The component ensures a visually engaging and professional way to showcase team members or user groups.
- Slarivo Animated Tooltip
Here is animated tooltip component
- Slarivo Avatar
Avatars represent a user or a team. Stacked avatars represent a group of people
- Slarivo Cybernetic Team Showcase
creative and interactive "Cybernetic Team Showcase" section. It displays your team members in a futuristic grid. When you hover over a card, a "cybernetic" scanning effect animates over their photo, and their social links appear with a glitchy animation.
- Slarivo Community Hub Card
Community Hub Card This card provides a centralized view of a community's key information, including member stats, an invite system, book progress, and an upcoming reading list.
- Slarivo Mentor Section
Mentor Section A responsive and animated component to display a filterable grid of mentors. It features smooth layout animations for filtering and subtle hover effects on each card, built with Framer Motion.
- Slarivo Avatar Group
Here is Avatar Group component
- Slarivo User Avatars
Here is User Avatars
- Slarivo Base Avatar
An easily stylable avatar component built with Base UI components.
- Slarivo Scroll Portrait Wall
A scroll-driven portrait wall with a sticky mix-blend-exclusion title. GSAP ScrollTrigger scrubs each portrait from scale 0 to 1 and back as its row crosses the viewport.
- Slarivo Avatar Group with Tooltip
A visually interactive avatar group with hover effects and tooltips, allowing users to easily view and highlight avatars with smooth animations.
- Slarivo ProjectPulseTracker
A clean and responsive project card that displays key project milestones alongside team member details. It uses a two-column layout with a timeline on the left and a list of contributors on the right, each with status indicators. Fully supports dark mode and adapts to different screen sizes.
- Slarivo Avatar
An avatar component with image, fallback text, multiple sizes, border radius variants, and group stacking. Built on Base UI Avatar primitives.
- Slarivo avatar
A reusable avatar component
- Slarivo The Dialog
Here is Dialog components
- Slarivo 8bit Team Grid
An 8-bit styled team grid block. Responsive card grid of team members with pixel avatars, name, role, and an optional corner badge. Built from retro avatar, badge, and card primitives.
- Slarivo Avatar
Here is Avatar component
- Slarivo Avatar
Here is Avatar component
- Slarivo Avatar
Here is Avatar component
- Slarivo Community Support Block
Highlights community forums, user groups, trending topics, and top contributors. Includes 'Ask the community' quick action.
- Slarivo Fallback Avatar
A unique gradient avatar generated from a name string.
- Slarivo Team Members Table
A team members table showing avatars, names, emails, roles, and status with colored badges.
- Slarivo Avatar Stack
An overlapping stack of team member avatars with hover tooltips showing names and roles, plus an overflow count and an add-member button.
- Slarivo Photo Stack
Animated Photo Stack A playful, layered card component that displays team or profile photos in a stacked, draggable style with smooth animations. Perfect for showcasing creative teams, communities, or social highlights in an engaging way.
- Slarivo Card
Flexible container component for grouping related content and actions.
- Slarivo Card Hover
Here is hover card component
- Slarivo The Item one
Here is The Item components
- Slarivo HeroUI Tag Group
HeroUI v3 TagGroup — selectable tags with sizes, variants, disabled, selection modes, controlled state, error message, prefix, removable tags and list-data management.
- Slarivo Avatar Group Empty State
A bordered empty-state card with an avatar stack and an invite button, used to prompt inviting team members to an empty workspace.
- Slarivo Collapsible
A minimal show/hide primitive built on Base UI's Collapsible. A trigger toggles a height-animated panel — perfect for read-more text, FAQ rows, nested groups and expandable log output. Controlled or uncontrolled via open / defaultOpen, with data-panel-open styling hooks. Ships Collapsible, CollapsibleTrigger and CollapsiblePanel (also exported as CollapsibleContent).
- Slarivo One Avatar
Team Sections component from the 21st.dev community.
- Slarivo Astryx Avatar
Avatar represents a person or team with a profile photo, initials, or a default icon, from Meta's Astryx design system. Use it in comment headers, contact lists, chat messages, user cards, and anywhere you need to identify someone visually. Includes AvatarStatusDot and AvatarGroup with overflow.
- Slarivo Astryx Avatar
Avatar represents a person or team with a profile photo, initials, or a default icon, from Meta's Astryx design system. Use it in comment headers, contact lists, chat messages, user cards, and anywhere you need to identify someone visually. Includes AvatarStatusDot and AvatarGroup with overflow.
- Slarivo Astryx Avatar
Avatar represents a person or team with a profile photo, initials, or a default icon, from Meta's Astryx design system. Use it in comment headers, contact lists, chat messages, user cards, and anywhere you need to identify someone visually. Includes AvatarStatusDot and AvatarGroup with overflow.
- Slarivo Astryx Avatar
Avatar represents a person or team with a profile photo, initials, or a default icon, from Meta's Astryx design system. Use it in comment headers, contact lists, chat messages, user cards, and anywhere you need to identify someone visually. Includes AvatarStatusDot and AvatarGroup with overflow.
- Slarivo Astryx Avatar Group
AvatarGroup displays multiple avatars in an overlapping row with an optional overflow indicator, from Meta's Astryx design system. Uses a compositional API: pass Avatar children directly so each avatar can carry its own props (status dots, click handlers, etc.). Includes AvatarGroupOverflow for +N counts or custom overflow content.
- Slarivo Astryx Avatar Group
AvatarGroup displays multiple avatars in an overlapping row with an optional overflow indicator, from Meta's Astryx design system. Uses a compositional API: pass Avatar children directly so each avatar can carry its own props (status dots, click handlers, etc.). Includes AvatarGroupOverflow for +N counts or custom overflow content.
- Slarivo Astryx Avatar Group
AvatarGroup displays multiple avatars in an overlapping row with an optional overflow indicator, from Meta's Astryx design system. Uses a compositional API: pass Avatar children directly so each avatar can carry its own props (status dots, click handlers, etc.). Includes AvatarGroupOverflow for +N counts or custom overflow content.
- Slarivo Astryx Avatar Group
AvatarGroup displays multiple avatars in an overlapping row with an optional overflow indicator, from Meta's Astryx design system. Uses a compositional API: pass Avatar children directly so each avatar can carry its own props (status dots, click handlers, etc.). Includes AvatarGroupOverflow for +N counts or custom overflow content.
- Slarivo Contributors Section
A cinematic 3D "wall of faces" that celebrates an open-source community.
- Slarivo Members Grid Block
A team members section with a header, search and invite actions, and a responsive grid of member avatars with names and roles.
- Slarivo Members Table Block
A team members block with a header bar and a table listing member names, emails, roles and join dates.
- Slarivo Invite Team Member Form
An invite team member form with an email field, a role select, and submit/cancel actions with a loading and sent confirmation state.
- Slarivo Invite Team Dialog
A modal dialog with an icon header and email field for inviting teammates to join a workspace.
- Slarivo User List Accordion
An accordion listing team members with avatars, names, and role badges that expand to reveal each member's permission details.
- Slarivo Tailwind Image Accordion
A horizontal image accordion where hovering or focusing a panel expands it and reveals a title and subtitle, built with pure Tailwind CSS group utilities.
- Slarivo Multi Select
A searchable multi-select dropdown with removable animated chips for choosing several options from a list.