📖 Step 4: Design - Research & Process#98 / 291

@2x / @3x

Retina Assets

📖One-line summary

Image scale factors for high-density displays.

Example

@1x
Blurry
24×24px
@2x
Sharp
48×48px
@3x
Very sharp
72×72px

Vibe coding prompt examples

>_

Build a tool that takes an uploaded image and auto-resizes it into @1x, @2x, @3x resolutions for download.

>_

Build a Next.js Image component that auto-loads @2x and @3x images via srcSet for Retina display support.

>_

Write a Node.js script that auto-generates @1x, @2x, @3x sizes of an iOS app icon from a 1024px source.

Try these prompts in your AI coding assistant!