Getting Started with Vanilla

Recommended Image Sizes

This article serves as a one-stop reference guide detailing the recommended sizes for images that you can upload in your Higher Logic Vanilla community.

📝 NOTE: Not all images listed below are required. Some are based on particular modules by subscription plan level (e.g., Knowledge Base and Subcommunities), while others are based on enabled addons (e.g., Groups, Ranks, Badges).

Style Guide (Theme Editor)

Navigation

Dashboard > Appearance > Branding & Assets > Style Guides > Edit a Theme

Images

Homepage Banner (desktop) – 1920px by 322px
Homepage Banner (tablet) – 768px by 255px
Homepage Banner (mobile) – 414px by 120px
Logo – 400px by 300px
Content Banner (desktop) – 1920px by 150px
Content Banner (tablet) – 768px by 255px
Content Banner (mobile) – 414px by 120px

✔️ TIP: To learn about enabling responsive breakpoints that ensure better rendering of Homepage and Content banner images, see:

https://success.vanillaforums.com/kb/articles/213

Branding & Assets

Navigation

Dashboard > Appearance > Branding & Assets > Branding & SEO

Images

Favicon – 16px by 16px
Touch Icon – 152px by 152px
Shared Image – 200px by 200px
Mobile Logo – 80px by 33px

Settings > left panel options

Navigation

Dashboard > Settings > various left panel pages

Images

Category Banner – 1000px by 400px
Category “Icon” Display Type – 200px by 200px
Category “Image” Display Type – resized category banner image (resized to 400px by 300px)
Category “Background” Display Type – resized category banner image (resized to 400px by 400px)
Avatar – 560px by 560px; customizable in the Dashboard (see Avatars)
Avatar Thumbnail – 200px by 200px; customizable in the Dashboard
Badges – 200px by 200px (see Badges)
Reactions – 200px by 200px (see Reactions)
Email Logo – 400px by 300px
Knowledge Base Icon – 200px by 200px
Knowledge Base Banner – 1000px by 400px
Knowledge Base Content Image – 600px by 400px
Subcommunity Icon URL – 200px by 200px
Subcommunity Banner – 1000px by 400px

Groups (community front end)

Navigation

Main navigation > Groups > New Group or Edit Group

Images

Group Icon – 200px by 200px
Group Banner – 1164px by 200px (i.e., 582:1)

Read this next!

Widget Builder Utils Library
Overview The Utils library (@vanilla /injectables/Utils) is a curated collection of utility functions, React hooks, and helper methods available to custom widgets and fragments in Vanilla's Widget Builder system. This library provides a safe, standardized way to access common functionality while building custom widgets.…
Mute Posts
As a member of an online community, you'll likely Follow and engage with numerous posts from other users, not to mention create your own posts that others engage with. Over time, you may come across threads that produce a high volume of engagement that you're not interested in, and this engagement can result in a similar…
Vanilla Co-Deploy
Co-Deploy: Empowering Customization for Your Community Forum At Higher Logic Vanilla (HLV), we understand that each organization has unique needs when it comes to community engagement. While many platforms offer basic theming and branding tools, Co-Deploy goes a step further, allowing Enterprise+ customers to fully…
Higher Logic – AI Terms of Use
Additional Terms for Use of AI Features By activating and/or using AI Features within the Software Services, the following terms (“AI Terms”) are hereby added to and become part of the Agreement between Higher Logic, LLC and your organization. Capitalized terms not defined in these AI Terms have the meanings given in the…