---
title: "Skin"
date: 2018-09-04
author: "nK"
---

# Skin

**Block settings → Skin.** A skin decides how one item looks: where the image sits, what is drawn over it on hover (the **overlay**), and what is written under it (the **caption**).

## Available skins

SkinWhat it doesText placement**[Classic](https://staging.visualportfolio.com/docs/gallery-blocks/skin/classic/)**Enlarges the image slightly on hover; an icon can appear over itCaption under the image**[Fade](https://staging.visualportfolio.com/docs/gallery-blocks/skin/fade/)** (default for new blocks)The image fades into the overlay color on hover; the text sits on the overlayOverlay**[Fly](https://staging.visualportfolio.com/docs/gallery-blocks/skin/fly/)**The overlay slides in from the side the pointer came fromOverlay**[Emerge](https://staging.visualportfolio.com/docs/gallery-blocks/skin/emerge/)**A caption panel rises from the bottom edge on hover; the image liftsCaption over the bottom of the image, plus an overlay tint**[Caption Move](https://staging.visualportfolio.com/docs/gallery-blocks/skin/caption-move/)** (**Pro**)The caption follows the pointer as a floating boxFloating caption, plus an overlay![](https://staging.visualportfolio.com/wp-content/uploads/2024/07/Shot-2024-07-11-at-18.07.03-1024x581.png)![](https://staging.visualportfolio.com/wp-content/uploads/2024/07/Shot-2024-07-11-at-18.07.03-1024x581.png)    Every skin keeps its own settings. Switching from Fade to Emerge starts from Emerge’s defaults; the Fade values stay stored and come back when you switch back.

## Settings tabs

Settings are grouped in tabs inside the Skin panel: **Image**, **Overlay**, **Caption**. A tab is hidden when the skin has nothing in it (Fade and Fly have no Caption tab). Inside Overlay and Caption, the settings are folded into **Elements**, **Colors**, **Typography** (**Pro**) and **Dimensions** (**Pro**).

For the full list of settings and defaults see [Skin settings reference](https://staging.visualportfolio.com/docs/gallery-blocks/skin/skin-settings-reference/).

## Hover and touch screens

Hover effects of every skin are pointer events. On touch screens there is no hover; use **Move Overlay Under Image** (**Pro**) or the **Display: Always** option so the text is visible without hovering.