//
Search across all documentation pages
11 pages in this section.
Install Lucide React, import individual icons by name, and customize them with props or Tailwind classes. Each icon is a separate module, so your bundle only in
Install React Icons to access thousands of icons from popular icon families through a single package. Each icon family uses a two-letter prefix and its own impo
Use the next/image component to automatically optimize images with lazy loading, responsive sizing, and modern formats (WebP/AVIF). Configure remote patterns fo
Use the Unsplash API to search and display high-quality, royalty-free photos in your Next.js app. Fetch data in Server Components to keep your API key secure an
Use the Pixabay API to search and display free stock photos and videos. Pixabay images are released under their own license, which allows free commercial use wi
Use the Pexels API to fetch high-quality, free-to-use photos and videos. Pexels uses an Authorization header for authentication and provides curated collections
Create reusable, accessible SVG icon components in React. Use inline SVG for full control, SVGR for importing .svg files as components, or an SVG sprite for opt
Use placeholder techniques to eliminate layout shift and provide visual feedback while images load. The main approaches are blur hash encoding, CSS shimmer skel
Use Next.js App Router conventions to configure favicons, generate dynamic Open Graph images, and set up social sharing metadata. Next.js supports both file-bas
A condensed summary of the 25 most important best practices drawn from every page in this section.