Infinite Scroll

Navigation Patterns

A content loading pattern where new items automatically load and append to the page as the user scrolls down, creating an endless feed experience.

Visual Examples

Example 1

Example 2

Example 3

Visual examples for Infinite Scroll coming soon.

How It Works in Apps/Websites

Infinite scroll detects when users approach the bottom of content and triggers loading of the next batch of items. Items append seamlessly below existing content. A loading indicator shows during fetch. Used by social media feeds, image galleries, and content discovery interfaces. Often combined with 'Back to top' button.

How AI Interprets This Term

When you say 'infinite scroll', AI expects: content that loads more items when scrolling near the bottom. Shows a loading spinner or skeleton at the bottom during fetch. New content appends without page reload. May include end-of-content indicator when all items are loaded.

Prompt Examples

Copy-paste these prompts to use in your AI tools.

Basic

Create an infinite scroll feed loading more posts

Detailed

Design infinite scroll for a product grid: detect when user is 200px from bottom, show skeleton placeholders for 6 items, load and append products. Include 'Back to top' button appearing after scrolling 500px. Show 'You've seen it all!' when no more products.

Comparative

Show the same product list with: pagination vs load-more button vs infinite scroll