Float Tiles

Float Tiles
Float Tiles

About Float Tiles

Showcase your social channels, product ecosystem, or brand links with FloatTiles—a high-performance 3D floating tile cluster built for Framer. Featuring multi-layer 3D extrusion, smooth cursor parallax, and versatile glassmorphism styles, FloatTiles turns static link sections into an immersive 3D experience.

✨ Key Features

  • 3 Distinct Material Styles:

    • Glass Case + Colored Core: Encapsulates vibrant colored 3D brand tiles inside a frosted acrylic outer shell.

    • Pure Clear Glass (Colorless): Crystal-clear frosted glassmorphism blocks that refract your custom background image or dark canvas.

    • Solid 3D Clay: Tactile, matte-finished extruded 3D blocks with specular edge highlights.

  • 4 Shape Modes (Global or Per-Tile): Switch between Mixed Shapes (dynamically cycles through all shapes), Squircle (Rounded Box), Smooth Rounded Hexagon, and Circle, or override shapes individually for each card.

  • 14+ Built-in Social & Tech Icons + Custom Upload: Includes vector masks for Framer, Instagram, Threads, X (Twitter), Facebook, TikTok, YouTube, Discord, GitHub, LinkedIn, Dribbble, Spotify, Figma, and Web Globe—or upload your own transparent PNG/SVG logo with one-click color tinting.

  • Custom Background Image & Dimmer: Upload any wallpaper image directly into the component with an adjustable dimmer overlay for ultimate branding control.

  • Instant Layout Shuffler & Card Count: Adjust the number of floating cards (1–12) and use the Shuffle Seed slider to procedurally generate balanced 3D orbital arrangements and tilt angles instantly.

  • 60fps GPU-Optimized Motion: Built with Framer Motion spring physics and useIsStaticRenderer compliance for buttery-smooth floating animation, hover elevation, and full-scene 3D cursor parallax without canvas lag.