The Team Card is a premium, code-based component designed for modern websites. It provides a sleek way to showcase team members, speakers, or personal profiles. Unlike standard components, this one is built with Framer Motion to ensure high-end fluidity and uses Smart Logic to keep the property panel clean.
Key Features:
Unified Font Control: Built-in integration with the official Framer Font Picker. Switch between System fonts, Google Fonts, or Custom assets with full control over weight and style.
Intelligent Backgrounds: Support for solid colors and linear/radial gradients. The background reacts to the card's tilt animation.
Adaptive Social Dock: Includes 7 built-in vector icons (LinkedIn, GitHub, X, Instagram, Facebook, TikTok, and Web). The dock only appears if at least one link is active.
Spring Animations: Uses physics-based transitions (stiffness: 260, damping: 20) for a realistic "pop" effect when hovered.
Developer-Friendly UI: The property panel uses conditional visibility—link fields only appear when their respective toggle is turned on.
Agency "About Us" Page:
Style: Use a clean, sans-serif font like Inter.
Background: Soft pastel gradients.
Focus: Showcase the creative team with LinkedIn and Web links.
Tech Conference Speaker List:
Style: Bold typography with JetBrains Mono.
Background: Dark mode with vibrant neon gradients.
Focus: Highlighting GitHub and X (Twitter) for developers and speakers.
Real Estate Agents Gallery:
Style: Classic serif font like Georgia.
Background: Solid elegant colors (e.g., Deep Navy or Emerald).
Focus: Direct links to Instagram and Facebook for property portfolios.
Content Creator Link-in-Bio:
Style: Playful fonts like Poppins.
Background: Multi-color mesh gradients.
Focus: Full social dock including TikTok and Instagram.
Bautista Calvo
