---
name: assets
description: Handling images, fonts, and external resources
metadata:
  tags: assets, images, fonts
---

# Asset Handling

## Goals

- Store assets locally for durability
- Preserve paths for pixel accuracy
- Keep `next/image` usage consistent

## Download Strategy

- Save images and SVGs to `public/assets`
- Save fonts to `public/fonts`
- Normalize filenames with stable hashes
- Preserve file extensions from content type

## URL Rewriting

- Replace remote URLs with `/assets/...` paths
- Keep data URLs only for small inline SVGs
- Store original URL in a manifest for traceability

## Component Usage

- Use `next/image` for raster images when possible
- Use `img` tags for remote or data URLs
- Prefer `width` and `height` attributes to avoid layout shift

## Font Mapping

- Translate `@font-face` to `next/font/local` when self-hosted
- Keep font weight ranges and style variants intact