Nessun torneo trovato

Iscriviti al tuo primo torneo per iniziare

Customizing Your Widget

Learn how to use the widget editor to customize elements, styling, colors, fonts, themes, and create stream overlays that match your brand.

## Design Widgets That Match Your Brand The widget editor in Spaghetti Showdown gives you full control over how your stream overlays look. Customize colors, fonts, layouts, and individual elements to create a scoreboard that matches your stream brand or tournament identity perfectly.

📸 Screenshot placeholder

The widget editor with customization options

### Opening the Widget Editor From your **Tournament Dashboard**, go to the **Widgets** tab and click **Edit** on any existing widget, or create a new one. The editor opens with a live preview on the right and customization controls on the left. Every change you make is reflected in the preview instantly, so you can see exactly how your widget will look on stream. ### Widget Elements Each widget type is composed of individual elements that you can show, hide, or rearrange: **Scoreboard Widget Elements:** - **Player Names** — Display names pulled from the tournament bracket or manually entered - **Score Counters** — Numeric score display with customizable size and style - **Character Icons** — Game-specific character portraits next to each player - **Game Title** — The name of the game being played - **Round Title** — The current round in the bracket (e.g., Grand Finals) - **Tournament Logo** — Your tournament or community logo You can toggle each element on or off depending on your layout needs. For example, you might hide the game title if your stream already has a permanent game logo. ### Styling Options The editor provides comprehensive styling controls: - **Colors** — Set background color, text color, accent color, and border color independently for each element - **Fonts** — Choose from a selection of web-safe fonts and Google Fonts. Set font size and weight for each text element - **Borders and Shadows** — Add borders, rounded corners, and drop shadows to give your widget depth - **Spacing** — Adjust padding and margins to control how elements are spaced relative to each other - **Opacity** — Set transparency levels for backgrounds and overlays

📸 Screenshot placeholder

Styling controls for colors, fonts, and layout

### Themes If you do not want to build a widget from scratch, choose from a library of **pre-built themes**. Themes provide a complete visual design that you can apply with one click. Available themes range from clean and minimal to bold and colorful, covering a variety of stream aesthetics. After applying a theme, you can still customize individual elements. The theme serves as a starting point that you refine to match your exact preferences. ### Saving and Previewing Click **Save** to apply your changes. The widget URL remains the same, so any OBS browser source pointing to it will automatically reflect the new design — no need to update the URL in OBS. Use the **Full Preview** button to open the widget in a new browser tab at its actual display size. ### Tips for Great Widget Design - **Keep it readable** — Use high-contrast colors so scores are visible even on busy game backgrounds - **Match your stream** — Use the same color palette and fonts as your other stream graphics - **Less is more** — Hide elements you do not need to keep the overlay clean - **Test on stream** — Always preview the widget over actual gameplay footage before going live The widget editor makes it possible to create professional-looking stream overlays without any design or coding experience.