This is a high-performance, zero-dependency Framer Code Component designed to replicate the functionality of a professional "Trusted By" section found in modern React applications (specifically Shadcn UI + Embla Carousel).
Key Features:
Infinite Step Scrolling: The component automatically cycles through a list of logos with a smooth "step" animation (spring physics), rewinding to the start seamlessly when it reaches the end.
3D Text Roll Title: Includes a built-in 3D text animation (TextRoll) that splits the title string and rotates characters in 3D space upon entering the viewport.
Shadcn-Style Cards: Logos are housed in interactive cards with configurable border radius, background colors, and subtle hover states, mimicking the clean aesthetic of Shadcn UI.
Fully Customizable:
Typography: Includes a complete Font Control system (Family, Size, Weight, Style) for the section title.
Responsive Layout: You can adjust "Items Visible" per breakpoint (e.g., 5 on Desktop, 2 on Mobile) to ensure perfect responsiveness.
Styling: Offers granular control over card height, corner radius, image padding, and a toggle for grayscale vs. color logos.
Self-Contained: It requires no npm installs (embla-carousel, lucide-react, etc.) or external libraries. You can paste the code directly into Framer, and it works immediately.
This is a high-performance, zero-dependency Framer Code Component designed to replicate the functionality of a professional "Trusted By" section found in modern React applications (specifically Shadcn UI + Embla Carousel).
Key Features:
Infinite Step Scrolling: The component automatically cycles through a list of logos with a smooth "step" animation (spring physics), rewinding to the start seamlessly when it reaches the end.
3D Text Roll Title: Includes a built-in 3D text animation (TextRoll) that splits the title string and rotates characters in 3D space upon entering the viewport.
Shadcn-Style Cards: Logos are housed in interactive cards with configurable border radius, background colors, and subtle hover states, mimicking the clean aesthetic of Shadcn UI.
Fully Customizable:
Typography: Includes a complete Font Control system (Family, Size, Weight, Style) for the section title.
Responsive Layout: You can adjust "Items Visible" per breakpoint (e.g., 5 on Desktop, 2 on Mobile) to ensure perfect responsiveness.
Styling: Offers granular control over card height, corner radius, image padding, and a toggle for grayscale vs. color logos.
Self-Contained: It requires no npm installs (embla-carousel, lucide-react, etc.) or external libraries. You can paste the code directly into Framer, and it works immediately.
