# Clickable Panel

<figure><img src="https://1297765105-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMoZPkWOmnKvoMWGW4aeM%2Fuploads%2F7FFS8FqQrJJPObaxOkWQ%2FClickable%20Panel%20Hero.png?alt=media&#x26;token=ccd06768-1053-4d0f-a364-a1d38bff211f" alt=""><figcaption></figcaption></figure>

## Overview

Clickable panels are used to display information in a clickable zone. Clickable panels are composed of a background icon and a title and can have a subtext and/or a tooltip (optional), and an arrow icon (optional and overridable). Icon background, title, and subtext have their own loading strategy.

## Guidelines

A clickable panel can either trigger a redirection (navigating to another page, opening a URL) or an action (opening a modal, requesting an API).

{% hint style="info" %}
A clickable panel cannot be used within another panel and cannot contain any child component.
{% endhint %}

## Content

Clickable panel content should follow our [content guidelines](https://design.mirakl.com/content/writing-for-mirakl).&#x20;

Both title and subtext must be as concise as possible and indicate clearly where the user will land or what they will be asked to do when clicking the panel.
