RVT.ai

Folio: Portrait Profile Cards

by @rvtNo reviews yet0 sales

Two styles of animated portrait profile cards for React: a team-card trio with share and add-to-contacts actions and a spotlight card with stats and follow button.

Open live preview (opens in a new tab)Runs in a sandbox · no sign-up needed

Try it live

The real demo, running in a sandbox. Switch the screen size to see how it adapts.

About this item

Folio gives you two ready-made ways to present people. The first is a row of tall portrait cards with name, role, a share button and an add-to-contacts action; the second is a spotlight card with a layered portrait, followers and projects stats and a follow action. Both animate softly on hover with Framer Motion.

Two card styles

Use the trio for team, speaker or creator grids and the spotlight card for a single featured profile, portfolio or about section.

Hover motion that feels premium

Cards lift, images shift and actions reveal with smooth Framer Motion transitions; everything is plain React and CSS.

Features

  • ✓Trio of portrait profile cards
  • ✓Spotlight profile card with stats
  • ✓Share and add-to-contacts actions
  • ✓Follower and project counters
  • ✓Hover lift and reveal animations
  • ✓Framer Motion powered
  • ✓Data-driven card array
  • ✓Plain CSS, no UI framework

What's included
Full JavaScript source code, package.json with locked dependencies, Vite config, RVT.ai README with setup and customisation guide, LICENSE and THIRD-PARTY-NOTICES.md. No node_modules: run npm install once.

Requirements
Node.js 20.19+ and npm 10+ to develop and build. The production build is static HTML, CSS and JavaScript that runs on any static host. No backend, API keys or paid services required.

Perfect for

  • Team and about pages
  • Speaker and creator line-ups
  • Portfolio and freelancer sites
  • Social and community apps

From download to production

  1. Download Folio: Portrait Profile Cards from your account and unzip it.
  2. Run npm install, then npm run dev to open it locally.
  3. Swap in your brand colours, copy and data (see the README customisation guide).
  4. Run npm run build and deploy the dist/ folder to any static host.

Support and updates
Includes free updates and six months of RVT.ai support. Ask pre-purchase questions in the product Q&A, or open a ticket at https://rvt.ai/support with your order number.

Choose the license for your project

A Regular license covers a single end product that is not sold to end users. Choose Extended for a single end product that is sold to end users, including SaaS products and paid applications. Review the full license terms before checkout.

Features

  • Trio of portrait profile cards
  • Spotlight profile card with stats
  • Share and add-to-contacts actions
  • Follower and project counters
  • Hover lift and reveal animations
  • Framer Motion powered
  • Data-driven card array
  • Plain CSS, no UI framework

Files included

  • Full source code (React + Vite)
  • README.md
  • LICENSE (RVT.ai)
  • THIRD-PARTY-NOTICES.md
  • package.json + package-lock.json

Version 1.0.0 and changelog

  1. Version 1.0.0

    Initial RVT.ai release.