Recommended Image Sizes and Formats – Happeo

Recommended Image Sizes and Formats

This article provides a complete reference for recommended image sizes, formats, and usage guidelines in Happeo, helping you ensure images display correctly and consistently across pages, channels, feeds, and other platform areas.

Overview

Using the correct image sizes and formats helps your organization keep content clear, consistent, and easy to consume across your platform. Properly sized images load faster, display correctly on all devices, and reduce issues like unexpected cropping or blurry visuals.

This article applies to anyone creating or managing visual content in Happeo, including Page editors, Channel owners, content creators, and admins.

Why image consistency matters

Visual consistency reinforces your platform's professionalism and usability. When images display correctly across devices and contexts, your team can focus on the content—not technical distractions. Consistent visuals also help maintain brand alignment and ensure your content looks credible and trustworthy.


Before you begin


General image size guidelines


Recommended image sizes by content type

Channel, Page, and content headers

Context Recommended size Notes
Channel header 2560 × 640 px Landscape (4:1). Minimum responsive size: 1142 × 285 px
Page hero header ~1428 × 400 px Approximate ratio 3.5:1
Article or Post cover 2560 × 640 px Common across articles and posts
Pages background image 2560 × 1920 px Cropped responsively

Images inside posts and articles

Context Recommended size Notes
Uploaded image Up to 2560 × 2560 px No strict aspect ratio

For most use cases, keep the longest side around 2560 px to balance quality and performance.


Toolbar logo

Context Recommended size
Toolbar logo (standard) Max 280 × 80 px
Toolbar logo (@2×) 140 × 40 px uploaded at double resolution

Feed widgets

Feed type Display size Display behavior Recommended size
News Feed (Thumbnail display) Visible from 86 × 86 px to 140 × 140 px Depends on column width 280 × 280 px (@2×)
Blog Feed Height: 142 px
Width: 224–338 px
Fixed height; width varies by column 676 × 284 px (@2×)
Carousel Feed — Fluid/depends on column width ~720 × 720 px up to 1920 × 720 px (@2×)
Banner Feed — Fluid/depends on column width ~720 × 720 px up to 1920 × 720 px (@2×)
Discussion Feed — Adhere to respective feed limits —
Tiny Feed (deprecated) — Not recommended; deprecated —

Page widgets

Widget type Applies to Display behavior Recommended size
Image widget Pages 2.0 Image scales to widget container —
Banner widget Legacy Pages Banner images are shown within a fixed-height banner, and enabling Use only images in the banner displays more of the uploaded image 5432 × 508 px
Banner widget Pages 2.0 Image scales to the type of banner selected (e.g. card vs. image-only), and widget configurations —

Email branding images

Context Recommended size
Email header image 670 × 100 px
Email logo 140 × 26 px

Images used in emails must be hosted via public URLs.


Custom login page images

Context Recommended size Notes
Favicon Max 64 × 64 px JPG, PNG, ICO, SVG
Login cover image 460 × 700 px (ideal) JPG, PNG, GIF
Sharper login cover 920 × 2048 px JPG, PNG, GIF
Login logo Max height 48 px JPG, PNG, SVG, GIF

Page template preview images

Context Recommended size Notes
Template preview image 800 × 600 px Larger images are cropped

User profile images

Image type Recommended size Format
User header image 1135 × 200 px JPG, PNG
User profile picture 720 × 720 px JPG, PNG

Custom emojis

Requirement Value
Size 20 × 20 px
Max file size 128 KB
Supported formats JPG, PNG, GIF
Background Transparent recommended

Supported formats and best practices

Choosing the right format


Governance and content quality tips


Summary / Cheat sheet

Context Recommended size Notes
Channel Header 2560 × 640 px JPG/PNG/GIF
Page Hero ~1428 × 400 px (3:5:1) JPG/PNG/GIF
Article Cover 2560 × 640 px JPG/PNG/GIF
Post Image Up to 2560 × 2560 px JPG/PNG/GIF
Pages Background 2560 × 1920 px JPG/PNG/GIF
News Feed Thumb 280 × 280 px (@2×) JPG/PNG/GIF
Blog Feed 676 × 284 px (@2×) JPG/PNG/GIF
Carousel / Banner Feed ~720 × 720 — 1920 × 720 px JPG/PNG/GIF
Banner Widget (Legacy Pages) 5432 × 508 px JPG/PNG/GIF
Banner Widget (Pages 2.0) Scales to selected type of banner JPG/PNG/GIF
Image Widget Scales to container JPG/PNG/GIF
Email Header 670 × 100 px Hosted via public URL
Email Logo 140 × 26 px Hosted via public URL
Login Favicon 64 × 64 px JPG/PNG/ICO/SVG
Login Cover 460 × 700 px (ideal) JPG/PNG/GIF
Login Logo Max 48 px height JPG/PNG/SVG/GIF
Template Preview 800 × 600 px JPG/PNG
Custom Emoji 20 × 20 px JPG/PNG/GIF
User Header Picture 1135 x 200 px JPG/PNG
User Profile Picture 720 x 720 px JPG/PNG

Troubleshooting

My image looks blurry

Upload a higher-resolution image, ideally @2× the display size.

Important content is cropped

Ensure key elements are centered. Happeo crops images responsively.

Images load slowly

Reduce file size and avoid uploading images larger than recommended.

My image isn't showing up in search results

Images themselves aren't indexed, but the content around them is. Ensure your Page or Channel has descriptive titles, summaries, and text to improve discoverability.

I uploaded a custom emoji, but it's not appearing

Check that the file size is under 128 KB and the format is JPG, PNG, or GIF. If the emoji still doesn't appear, contact your admin to verify emoji permissions.