Image Dimensions Standard

This page defines the consistent image dimensions used throughout the web app for performance and visual consistency.

Standard dimensions by use case

Content images (3:2)

• Use case: Main content images, blog images, build images
• Standard: 1200×800

Cropping guidance:

• Use crop="fill" with gravity="auto" (or aspect_ratio="3:2") to produce standardized exact 3:2 outputs.
• Use crop="fit" only when preserving the entire image without cropping is desired (this may not produce exact 1200×800 for non-3:2 sources).

Square thumbnails (1:1)

• Use case: Gallery thumbnails, profile images, icons
• Standard: 320×320

Card images (3:2)

• Use case: Update cards, project tiles
• Standard: 480×320

Build tiles (1:1)

• Use case: Build list thumbnails
• Standard: 256×256

Background images (3:2)

• Use case: Background images in cards
• Standard: 240×160

Small feed thumbnails (1:1)

• Use case: Small thumbnails in feeds
• Standard: 100×100

Micro icons (1:1)

• Use case: Very small icons / avatars
• Standard: 80×80

Video content (16:9)

• Use case: Video players, video thumbnails
• Standard: 1920×1080

Cloudinary optimization notes

• Prefer Cloudinary automatic optimization (f_auto, q_auto).
• Use smart cropping with gravity="auto" for square/thumbnail transforms.