# Webcam Frame

Put a styled frame and a nameplate around your facecam that matches the rest of your overlay.

The **Webcam Frame** draws a border around your camera, with an optional nameplate for your name and a second line. The middle stays see-through, so your real camera shows through from OBS.

Pick the same look as your other widgets and your camera fits right into the overlay.

::: widget webcam-frame standard 260

## Add it

::: steps
Click **Add** in the toolbar (or press `kbd:W`) and pick **Webcam Frame** under **Cam & Frames**.

Choose an **Aspect ratio** that matches your camera, for example **16:9 (widescreen)** or **9:16 (portrait)**.

Type your **Name** and, if you like, a **Second line**.

Pick a look with **Choose a look** and move the frame to where your camera should sit.
:::

## Line it up in OBS

The frame is only the border. In OBS, put your **Video Capture Device** below the PX Studio browser source and size it so it fills the hole in the frame. See [Add to OBS](/docs/add-to-obs) for setting up the browser source.

> [!TIP]
> Size the frame first, then fit the camera to it. If you change the frame size later, adjust the camera in OBS to match.

## Size and shape

- **Aspect ratio** sets the shape. **Custom** lets you set **Frame width (px)** and **Frame height (px)** freely.
- **Band (px)** is the thickness of the border. A slim line usually reads best; the range follows the look.
- **Corners (px)** rounds the frame.
- **Vignette (px)** adds a soft inner shadow at the edge of the hole. 0 is off.

## Nameplate

**Nameplate** turns the plate on or off. Leave **Name** empty for no plate. You can change its color and size, put it **Inside** or **Outside** the frame and pick a **Nameplate position**, or keep the look's default. **Offset X (px)** and **Offset Y (px)** nudge it.

## Colors and motion

**Accent color** colors the frame in most looks; leave it empty to keep the look's colors. **Animation** turns the frame's movement on or off.

The **Minimalism Dark** look has extra options: a running beam with **Beam length** and **Beam color**, **Corner brackets**, a **Border color** and an **Accent gradient** such as Aurora or Sunset.

## Tips

- Use one frame per camera. A second frame for a guest works the same way.
- **Placement** set to **Outside** keeps the nameplate off your face.

## Looks

Pick a look under **Look** in the settings card. Every look is a complete style; colors and fonts you set yourself stay on top. 15 looks are available:

::: looks webcam-frame
standard Standard
miami Miami
lootdrop Loot Drop
comic-pop Comic Pop
cinematic Cinematic
esports Esports
terminal Terminal
blocky Blocky
lofi Lofi
neon-pulse Neon Pulse
midnight Midnight
pastel-pop Pastel Pop
retro-arcade Retro Arcade
gilded Gilded
minimalism-dark Minimalism Dark
:::

## Settings

All settings live in the floating settings card on the right of the editor. Defaults are what a new widget starts with.

### Content

| Setting | Default | Values | Notes |
| --- | --- | --- | --- |
| Nameplate | On | On or off |  |
| Name | Empty | Text | Shown on the look's name plate. Leave empty for no plate. |
| Second line | Empty | Text | Optional line under the name. |
| Nameplate color | Look default | Any color |  |
| Nameplate size (%) | 100 | 50 to 200 |  |
| Placement | Inside | Inside, Outside |  |
| Nameplate position | Look default | Look default, Top left, Top center, Top right, Bottom left, Bottom center, Bottom right |  |
| Offset X (px) | 0 | -500 to 500 |  |
| Offset Y (px) | 0 | -500 to 500 |  |

### Appearance

| Setting | Default | Values | Notes |
| --- | --- | --- | --- |
| Accent color | Look default | Any color | Colors the frame in most looks. Minimalism Dark uses it for the beam and the name tag edge. Leave empty to keep the look's colors. |
| Animation | On | On or off |  |
| Motion | Full (the beam runs) | Full (the beam runs), Static |  |
| Beam length | Standard | Short, Standard, Long, Extra long |  |
| Border color | Look default | Any color | Leave empty for the look's translucent white border. |
| Corner brackets | On | On or off |  |
| Corner color | Look default | Any color | Leave empty for white. |
| Beam color | Look default | Any color | Follows the accent color until you pick one. |
| Accent gradient | Look default | Look default, Rainbow, Aurora, Sunset, Ocean | Look default keeps the single accent color. A gradient runs through the beam and the name tag edge; a beam color of your own keeps the beam in that color. |
| Band (px) | 5 | 1 to 40 | A slim line reads best. The range follows the look. |
| Corners (px) | 8 | 0 to 80 |  |
| Vignette (px) | 0 | 0 to 120 | Soft inner shadow at the hole edge. 0 is off. |
| Editor fill | Off | Off, On |  |
| Editor fill color | `#18181b` | Any color | Only visible with the center fill enabled. |

### Layout

| Setting | Default | Values | Notes |
| --- | --- | --- | --- |
| Aspect ratio | 16:9 (widescreen) | Custom, 16:9 (widescreen), 4:3 (classic), 1:1 (square), 9:16 (portrait) |  |
| Frame width (px) | 800 | 200 to 1920 |  |
| Frame height (px) | 450 | 150 to 1080 |  |