Canonical: https://www.skillhive.com/en/user-guide/swarm-featured-images
Language: en
Updated: 2026-09-16
Parent: Skillhive User Guide (https://www.skillhive.com/en/user-guide/skillhive-user-guide)

# Swarm featured images



## Why Swarm Images Matter

Swarm images are an essential part of the user experience and serve several purposes:

**Attracting attention**

Images make content visually engaging and easier to scan.

**Enhancing understanding**

Visual elements support communication and help users grasp content quickly.

**Setting the tone**

Images shape the emotional and visual atmosphere of the platform.

**Strengthening brand identity**

A consistent visual style reinforces organizational identity.

**Differentiating content**

Images help users distinguish between different types of swarms.

**Improving overall design quality**

Well-designed visuals make the platform feel professional and cohesive.

# Image Size and Cropping

Swarm images are responsive and adapt to screen size. While there is no single fixed pixel size recommendation, the following principles apply.

## 1\. Swarm Card (List View)

-   Always cropped horizontally.
    
-   Cropping is centered.
    
-   Width: 360 px (or less on narrow screens).
    
-   Minimum height: approx. 125 px.
    
-   Height may increase if title wraps to multiple lines.
    
-   Bottom ~55 px reserved for overlay text.
    
-   A dark gradient improves text readability.
    

On wider screens, multiple cards are displayed side by side rather than increasing image size.

## 2\. Swarm Page (Header Image)

-   Height: 50% of screen height.
    
-   Width: Full screen (or up to main navigation edge).
    
-   Cropping is centered.
    

Bottom overlay includes action buttons:

-   One row ≈ 50 px
    
-   Two rows ≈ 90 px
    

## Orientation and Cropping Behavior

-   Landscape view → horizontal crop
    
-   Portrait view → vertical crop
    

Depending on screen ratio, significant parts of the image edges may be cropped.

When selecting images:

-   Keep the focal point centered
    
-   Avoid critical elements near edges
    
-   Avoid placing text near image boundaries
    

Images work best when they do not rely on one small edge detail.

* * *

### Ready to use

These example images were created with ChatGPT and are free for Skillhive customers to use in their own Skillhive environment. You can download them and use them as they are, or use them as inspiration for creating your own visual style.

No attribution required.