---
title: "How To Color Folders in SharePoint Online"
description: "Use color-coded folders with the Vitextra List Filter Online web part to make document libraries in SharePoint Online easier to scan and organize."
url: https://vitextra.com/en/support/how-to/color-folder-in-document-library-or-list
language: en
published: 2024-03-09
modified: 2026-10-22
products:
  - "List Filter Online"
---

# How To Color Folders in SharePoint Online

**Tools:** SharePoint Online, Vitextra List Filter Online

The context menu of a folder in the List Filter Online web part with the Folder Color submenu open, showing the palette of 16 preset colors.

## 1. Add the Web Part

![Add the Web Part](https://static.vitextra.com/articles/50010/color-folder-in-document-library-or-list-Step1-en.png)

Go to your SharePoint site and add the List Filter Online web part to your page from the web part gallery.

*Alternatively, you can open an existing page where the List Filter Online web part is already present.*

**If the web part is already present, you can skip to [Step 4](https://vitextra.com/en/support/kb/how-to-color-folder-in-document-library-or-list#step4).**

## 2. Provide the Required Parameters

![Provide the Required Parameters](https://static.vitextra.com/articles/50010/color-folder-in-document-library-or-list-Step2-en.png)

Click the **Configuration** button to open the configuration panel. You need to provide three required parameters:

- Enter the URL or name of the SharePoint **site** that contains the list or document library.
- Select the specific **list** or **document library** you want to display data from.
- Choose the **columns** you want to include in the list view.

## 3. Customize Display Options

![Customize Display Options](https://static.vitextra.com/articles/50010/color-folder-in-document-library-or-list-Step3-en.png)

Set captions, order, and other settings for each column to control how they appear in the list view.

❗ **Important**  
Make sure you have included the **Type** column in the list view — it is what displays icons for folders and other item types, and colored folders rely on it being present.

## 4. Create a New Folder (Optional)

![Create a New Folder (Optional)](https://static.vitextra.com/articles/50010/color-folder-in-document-library-or-list-Step4-en.png)

Click the **+ New** button on the command bar and select **Folder**. Enter a name for your new folder.

## 5. Choose the Folder Color

![Choose the Folder Color](https://static.vitextra.com/articles/50010/color-folder-in-document-library-or-list-Step5-en.png)

Right-click an existing folder, or the one you just created, and select the color you want from the available palette in the **Folder Color** context menu.

📝 **Note**  
The color is applied immediately once selected — there is no separate save step, and nested folders do not automatically inherit the color of their parent folder.

💡 **Tip**  
Colored folders combine well with other List Filter Online features. See [KB10031. Filtering Controls Overview](https://vitextra.com/en/support/kb/10031) and [KB10025. Filtering by a Date Range](https://vitextra.com/en/support/kb/10025) to filter a large, color-coded library down to exactly what you need.

A handful of consistent folder colors — for example, one color per project phase, department, or urgency level — turns a flat list of folder names into something a person can scan in a second. Because the coloring lives on the folder itself, it shows up the same way everywhere the folder appears, including in the List Filter Online views used to filter and export the library. See [KB10013. Exporting List Filter Online Results](https://vitextra.com/en/support/kb/10013) if you also need to get a colored-and-filtered view of the library out into Excel.