# Depth

> Depth is a library of premium and free assets for Framer: ready-made website templates, copy-paste code components, and vector assets. Everything is built to drop into a Framer project and restyle, without writing code.

Depth sells and gives away three kinds of assets. Templates are complete multi-page websites. Components are single interactive pieces — WebGL backgrounds, cursor and scroll effects, text animations, carousels and small utilities. Vectors are illustration assets. Components are grouped into categories and can be filtered by category, price and bestseller status.

Counts at the time of writing: 95 components, 10 templates, 2 vectors.

## Main pages

- [Templates](https://depth.website/): complete Framer website templates
- [Components](https://depth.website/components): individual Framer components, filterable by category and price
- [Vectors](https://depth.website/vectors): vector assets
- [Sections](https://depth.website/sections): prebuilt page sections, launching soon
- [Changelog](https://depth.website/changelog): what shipped recently
- [Request an asset](https://depth.website/request): ask for something that is not in the library
- [Support](https://depth.website/contact): help and questions

## Templates

- [Pancu AI](https://depth.website/templates/pancu-ai): Most Powerful AI Tool Template
- [The Kultur](https://depth.website/templates/the-kultur): Agency Template
- [Curated](https://depth.website/templates/curated): Free Product Directory Template
- [The Muse](https://depth.website/templates/the-muse): Agency Template
- [The Chapter](https://depth.website/templates/the-chapter): Simple Agency & Portfolio Template
- [Morpho](https://depth.website/templates/morpho): Free mobile app template
- [App Directory](https://depth.website/templates/app-directory): Agency Template
- [Vanta](https://depth.website/templates/vanta): SaaS Template
- [Nodera AI Agent](https://depth.website/templates/nodera-ai-agent): Modern landing page
- [Vela Waitlist](https://depth.website/templates/vela-waitlist-coming-soon): Coming soon template

## Components by category

### Backgrounds (43)

- [DVD Screensaver](https://depth.website/components/dvd-screensaver) (free): The DVD screensaver, inside Framer.
- [Dither Media](https://depth.website/components/dither-media): Dynamic ASCII-inspired visuals
- [Dither Reveal](https://depth.website/components/dither-reveal): Living, retro-print artwork
- [Progressive Blur Pro](https://depth.website/components/progressive-blur-pro): Apple-inspired progressive blur
- [Fluted Glass](https://depth.website/components/fluted-glass): Look of fluted/ribbed glass
- [Liquid Aurora](https://depth.website/components/liquid-aurora): Real-time WebGL shaders
- [Halftone Colorful](https://depth.website/components/halftone-colorful): Recreate real CMYK offset printing
- [Halftone Dots](https://depth.website/components/halftone-dots): Bold, print-inspired halftone
- [Image Dither Paper Style](https://depth.website/components/image-dither-paper-style): Striking retro-dithered visual
- [Dot Grid](https://depth.website/components/dot-grid): Static grid pattern
- [Dither Paper Style](https://depth.website/components/dither-paper-style): Dithering pattern generator
- [Mesh Gradient](https://depth.website/components/mesh-gradient): Flowing mesh gradient background
- [Color Panel Paper Style](https://depth.website/components/color-panel-paper-style): Glowing, translucent 3D panels
- [Neural](https://depth.website/components/neural): Web-like network of fluid lines
- [Noise Effect](https://depth.website/components/noise-effect): Add a subtle animated noise layer
- [Paper Texture](https://depth.website/components/paper-texture): Tactile paper/cardboard surface
- [Grain Gradient](https://depth.website/components/grain-gradient): Grain-textured gradient
- [Perlin Noise](https://depth.website/components/perlin-noise): The classic animated Perlin noise
- [Radial Gradient](https://depth.website/components/radial-gradient): Customizable radial gradient
- [Water Wave](https://depth.website/components/water-wave): Simulate a realistic water surface
- [Simplex Noise](https://depth.website/components/simplex-noise): A multi-color gradient
- [Smoke Background](https://depth.website/components/smoke-background): Atmospheric smoke effect
- [Smoke Ring](https://depth.website/components/smoke-ring): A radial, multi-color gradient
- [Spiral](https://depth.website/components/spiral): Animated spiral that morphs
- [Sunlight](https://depth.website/components/sunlight): Animated rays of light
- [Swirl](https://depth.website/components/swirl): Animated bands of color twisting
- [Voronoi Paper Style Shader](https://depth.website/components/voronoi-paper-style-shader): A smooth, animated Voronoi pattern
- [Waves](https://depth.website/components/waves): A configurable line pattern shader
- [Warp Speed Lines](https://depth.website/components/warp-speed-lines): The vanishing follows your pointer
- [Dot Pulse](https://depth.website/components/dot-pulse): Animated field of dots
- [Random Background Color](https://depth.website/components/random-background-color): Changing color background
- [Real Shadows](https://depth.website/components/real-shadows): Soft animated shadows feel natural
- [Watercolor Shader](https://depth.website/components/watercolor-shader): Watercolor-inspired background
- [Wave Effect](https://depth.website/components/wave-effect): Animated field of flowing particle
- [Double Wave](https://depth.website/components/double-wave): Layered, fluid smooth wave effect
- [Sound Lines](https://depth.website/components/sound-lines): Animated field of flowing lines
- [Star Voyage](https://depth.website/components/star-voyage): Dynamic starfield with parallax and warp-speed effects
- [Rays](https://depth.website/components/rays): Cinematic volumetric light rays
- [Color Bends](https://depth.website/components/color-bends): Flowing bands of color with motion
- [Wave Lines Pro](https://depth.website/components/wave-lines-pro): Animated line fields with flowing motion
- [Warp Stripes Shader](https://depth.website/components/warp-stripes-shader): Fluid animated stripe backgrounds
- [Cosmic Bloom](https://depth.website/components/cosmic-bloom): Hypnotic, iris-like bloom of light
- [Plasma](https://depth.website/components/plasma): Deep, slowly swirling plasma

### Interactions (16)

- [Notification Center](https://depth.website/components/notification-center) (free): Polished notification bell
- [Lens Blur Effect](https://depth.website/components/lens-blur-effect): Interactive blur lens to any image
- [Image Trail Effect](https://depth.website/components/image-trail-effect) (free): Bring motion to any section
- [Holographic Card](https://depth.website/components/holographic-card): Interactive holographic experience
- [Pixel Image Reveal](https://depth.website/components/pixel-image-reveal): Eye-catching reveal animation.
- [Water Ripple Flow](https://depth.website/components/water-ripple-flow): Interact with static images
- [Shader Ripple Card](https://depth.website/components/shader-ripple-card): Stunning ripple distortion effect
- [Spiral Image Effect](https://depth.website/components/spiral-image-effect): Mesmerizing spiral animations
- [Toast Messages](https://depth.website/components/toast-messages): Customizable toast notification
- [After Before Slider](https://depth.website/components/after-before-slider): Compare two images
- [Cursor Dither Trail](https://depth.website/components/cursor-dither-trail): Retro-inspired dither trail that follows your cursor
- [AirDrop Effect](https://depth.website/components/airdrop-effect): A liquid glow that ripples along your image
- [Mouse Click Effect](https://depth.website/components/mouse-click-effect): Give every click a celebration
- [Mouse Distortion](https://depth.website/components/mouse-distortion): Make your images react to the cursor
- [Scratch to Reveal](https://depth.website/components/scratch-to-reveal): Turn any card into a scratch card
- [Sound Interaction Toggle](https://depth.website/components/sound-interaction-toggle): Add subtle audio feedback to your whole site

### Utilities (12)

- [Simple Preloader](https://depth.website/components/simple-preloader) (free): Free smooth intro text animation
- [Smooth Scroll Ease](https://depth.website/components/smooth-scroll-ease) (free): Smoother scrolling experience
- [Device Size](https://depth.website/components/device-size): Visitor’s current view dimensions
- [Mode Switch](https://depth.website/components/mode-switch): Expressive dark and light mode
- [Summarize with AI](https://depth.website/components/summarize-with-ai): Summarize any page with AI tools
- [Smart Cookie Pro](https://depth.website/components/smart-cookie-pro): Fully customizable cookie consent
- [Business Hours](https://depth.website/components/business-hours): Show whether you're open right now
- [Last Updated](https://depth.website/components/last-updated): Show how fresh your site is
- [Lazy Image Loader](https://depth.website/components/lazy-image-loader): Images that load gracefully
- [Local Time](https://depth.website/components/local-time): A live clock for your site
- [QR Code Generator](https://depth.website/components/qr-code-generator): Custom QR codes generated right inside Framer
- [Reading Time](https://depth.website/components/reading-time): A clean "5 min read" badge for your articles

### Carousels (6)

- [Film Roll](https://depth.website/components/film-roll): Cinematic 3D film reel
- [Rotating Image Gallery](https://depth.website/components/rotating-image-gallery): Create an immersive gallery
- [Rotating Scroll Gallery](https://depth.website/components/rotating-scroll-gallery): Create immersive, rotating gallery
- [Spindrift Gallery](https://depth.website/components/spindrift-gallery): Interactive 3D sphere
- [Time Machine](https://depth.website/components/time-machine): Interactive gallery journey
- [Swipe Images](https://depth.website/components/swipe-images): Interactive swipe-based gallery

### Typography (5)

- [Advance Underline Text](https://depth.website/components/advance-underline-text): Advance Underline Text - 12 Styles
- [Prism Text Reveal](https://depth.website/components/prism-text-reveal) (free): Turn any headline into an interact
- [Text Stagger](https://depth.website/components/text-stagger): Polished, stagger animation
- [Vanish Text](https://depth.website/components/vanish-text): Headline rotator with a twist
- [Glow Text](https://depth.website/components/glow-text): Text that lights up as the cursor comes near

### Navigation (3)

- [Logo Right Click](https://depth.website/components/logo-right-click): Custom right-click menu
- [Auto Breadcrumb](https://depth.website/components/auto-breadcrumb): Breadcrumbs that build themselves
- [Table of Contents](https://depth.website/components/table-of-contents): A table of contents that writes itself

### Sections (3)

- [Project Tabs](https://depth.website/components/project-tabs): Showcase your projects
- [Smooth Tabs](https://depth.website/components/smooth-tabs): Tab with smooth transitions
- [Smart Announcement](https://depth.website/components/smart-announcement): One bar for every campaign

### Data (2)

- [Nice Counter](https://depth.website/components/nice-counter) (free): Free Counter with nice controls
- [Live Visitor Count](https://depth.website/components/live-visitor-count): Display live visitor activity

### Layout (2)

- [Infinite Canvas Scroll](https://depth.website/components/infinite-canvas-scroll): Scroll-driven image experiences
- [Petal Press](https://depth.website/components/petal-press): Circular 3D layout

### Buttons (2)

- [Back to Previous Button](https://depth.website/components/back-to-previous-button): Return to the previous page
- [Back to Top Button](https://depth.website/components/back-to-top-button): Return to the beginning of a page

### CMS (1)

- [CMS Counter](https://depth.website/components/cms-counter): Display the total number of items

## Vectors

- [Flowers](https://depth.website/vectors/flowers): A set of 16 unique flower and star vector icons
- [Rectangle Alphabet](https://depth.website/vectors/rectangle-alphabet): A bold geometric vector alphabet set