# Mod Listing Panel

The first panel in the Page Editor lists your available mods. This is called the **Mod Panel.**

### What is a Mod?

A mod is a grouping of one or more actions and enhancements that can run on a web page. Mods are created by combining any number of mix-and-match steps called **✨ Bricks ✨.**

### Mods Panel Layout

At the top of the Mods Panel, there are three buttons:

1. The home icon takes you to a view where you can discover templates
2. The "New Mod" button is where you start building a new mod
3. The << button collapses the panel.

<figure><img src="https://2274778196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq123bF1HPQPV35s5vHa1%2Fuploads%2FlkjLP0IKzpFbFfppROiz%2Fimage.png?alt=media&#x26;token=304f5e92-d233-4ecb-a1b8-413c0fa1459e" alt=""><figcaption></figcaption></figure>

* **Home Button:** clicking the home button takes you to the Page Editor welcome message, showing helpful links and resources

<figure><img src="https://2274778196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq123bF1HPQPV35s5vHa1%2Fuploads%2FQo8O36kBbuO0bD6mVrx4%2Fimage.png?alt=media&#x26;token=6e0a35cb-ed01-44d1-bbe9-ba0e5c4f3244" alt=""><figcaption></figcaption></figure>

* **New Mod Button**: This is where it all begins! Clicking Add shows the starter bricks you can select for [types-of-mods](https://docs.pixiebrix.com/developing-mods/developer-concepts/types-of-mods "mention").
* **Collapse/Expand Button:** click to collapse the Mods Panel. You can re-expand the panel by clicking the button again.

Each mod listed has the following information and actions:

<figure><img src="https://2274778196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq123bF1HPQPV35s5vHa1%2Fuploads%2Fc5TV9s2uIgHmeVu7LP2C%2Fimage.png?alt=media&#x26;token=45b71250-47a9-4c5b-be43-6056d2e0ab12" alt=""><figcaption></figcaption></figure>

* **Icon:** indicates the type of starter brick
* **Name:** the name of the mod or mod package
* **Save Indicator/Button:** click the button to save changes. The button will only be enabled if there are unsaved changes
* **Action Menu** (three dots menu): a dropdown menu with the following actions:
  * Reset: resets any unsaved changes
  * Remove: remove a mod from your device. The mod will still be available from your PixieBrix account
  * Add to Mod: add the action/enhancement to a new or existing mod
  * Remove from Mod: remove an action/enhancement from a mod
  * Make a Copy: create a copy of the mod

### Search For a Mod

Mods are sorted alphabetically in the mod panel. Use the search bar below the Add button to search for the name of a mod instead of scrolling through your list.

<figure><img src="https://2274778196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq123bF1HPQPV35s5vHa1%2Fuploads%2FyYc8NR5nwA8g6oZiC0yj%2FCleanShot%202024-10-24%20at%2018.44.08%402x.png?alt=media&#x26;token=a4d7df4e-f409-47f6-8e99-ad9b5987aa9e" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
If you want a mod to always appear at the top of the list, start the mod name with `A` or a symbol like `[`.
{% endhint %}