# How to use pixel-perfect components

*how to use (lists, standalone, cells), how to use marketplace, how to modify, how to start from scratch.*\
*change all arcades*\
\
There are three options for how you can apply **Custom Components**:

### **1. Cards in List components** (Gallery, Kanban, Map, Calendar, Timeline)

To apply Custom Cards in the List, follow the steps:

1. Click on the **Gallery**
2. Click on the **Property card** button in the right panel
3. From the dropdown menu, choose **Use Marketplace Component**

{% @arcade/embed flowId="JYKsK1BdIV7d9k0M7zBl" url="<https://app.arcade.software/share/JYKsK1BdIV7d9k0M7zBl>" %}

### **2. Standalone components** (Profile headers, documents, summary, banners)

1. Click on the **Gallery**
2. Click on the **Property card** button in the right panel
3. From the dropdown menu, choose **Use Marketplace Component**
4. Choose **Standalone**

{% @arcade/embed flowId="AMWkAbZ3VheaJcDtRedX" url="<https://app.arcade.software/share/AMWkAbZ3VheaJcDtRedX>" %}

### **3. Record fields** (health, metrics, user/product)

1. Click on the **Gallery**
2. Click on the **Property card** button in the right panel
3. From the dropdown menu, choose **Use Marketplace Component**
4. Choose **Record fields**

{% @arcade/embed flowId="kSyE0e2qEx0iztHxjBAt" url="<https://app.arcade.software/share/kSyE0e2qEx0iztHxjBAt>" %}

### **4. Menu items**

1. Navigate to the menu settings
2. Add a new item to the menu
3. Select **Custom component**

{% @arcade/embed flowId="WHhdwGlrCI3Ew9ZmyBan" url="<https://app.arcade.software/share/WHhdwGlrCI3Ew9ZmyBan>" %}