> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dogebot.net/llms.txt
> Use this file to discover all available pages before exploring further.

# Make your first card

> Open the Card Studio editor and make a card, step by step.

Let's make your first card. The easiest way is to start from a **template** and change it.

**1. Open Card Studio**

In the sidebar, open **Build**, then **Card Studio**.

**2. Pick a template**

Open the **Templates** tab. Pick one you like, for example a welcome card, and press **Use this**. A copy goes into **your cards**. See [Templates and your pictures](/card-studio/templates-and-your-pictures).

**3. Change the words**

Click a text layer and type your own words. Use the **insert a value** button next to the box to add values, like `{user_displayName}`.

**4. Change the style**

Pick a font, a colour, or a whole new **look**. See [Looks](/card-studio/looks) and [Fonts](/card-studio/fonts).

**5. Save**

Press **Ctrl + S** to save.

**6. Send yourself a test**

Press **Send me a test**. Your bot sends you the real card in a private message, with your own Discord picture and name.

## The parts of the editor

When you open a card, the editor opens **full screen**. It is a bit like a drawing app. To go back to the dashboard, press **Card Studio** at the top left.

**Left side**

The left side has tabs with things you can add.

| Tab | What is inside |
| - | - |
| **Templates** | Ready-made cards. Press **Use this** to copy one into your cards. |
| **Looks** | 22 styles that change the whole card. See [Looks](/card-studio/looks). |
| **Shapes** | Rectangles, circles, lines, badges and more. |
| **Text** | Headings, subheadings, ready-made pairs and **Seasonal headings**. Also **Upload a font**. |
| **Pictures** | Your uploaded pictures. Upload once, use on any card. |
| **Layers** | Every item on your card, in order. See [Layers](/card-studio/layers). |

**Quick-edit bar**

When you select a layer, a bar shows above the card with the settings people use most:

* **font**, **size** and **colour**
* **bold** and **text alignment**
* **line up**: to the edges or the middle of the card
* **forward and back**
* **lock**, **duplicate** and **delete**

**Right side**

Every setting of the selected layer: colours, fades, borders, roundness, shadows and more.

## Moving things around

| What you want | How to do it |
| - | - |
| **Move** a layer | Drag it. Guides pop up to help you line it up with the edges, the middle and other layers. Hold **Alt** to move freely. |
| **Resize** a layer | Drag a corner handle. Hold **Shift** to keep the same shape. |
| **Zoom** | Zoom in, zoom out, or press **Fit**. |

## Keyboard shortcuts

| Keys | What it does |
| - | - |
| **Delete** | Delete the selected layer. |
| **Arrow keys** | Nudge the layer a little. |
| **Ctrl + Z** | Undo. |
| **Ctrl + Y** | Redo. |
| **Ctrl + D** | Duplicate. |
| **Ctrl + S** | Save. |

## Showing values on a card

Any text, picture, bar or grid can show values. Press the **insert a value** button next to a box and pick one.

> **Example**
>
> You type this in a text layer: `Welcome, {user_displayName}! You are member {server_members}.`
>
> The card shows: **Welcome, Sam! You are member 120.**

You can use built-in values like `{user_displayName}` and `{server_members}`, and your own variables, like `{DBVAR_coins}`. See [Built-in variables](/variables/built-in-variables).

## Exact preview

The preview draws your card **exactly** the way your bot will send it. What you see is what your members get.

## Send me a test

Press **Send me a test** and your bot sends you the real card in a private message, with your own Discord picture and name. It uses your linked Discord account, or asks for your Discord user ID.

> [!TIP]
>
> Link your Discord account first with **Link Discord** in the sidebar. Then the test goes straight to you.

## Next

> **[Layers](/card-studio/layers)**
>
> Every kind of layer you can add.

> **[Send cards from your bot](/card-studio/send-cards-from-your-bot)**
>
> Make your bot send the card.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.