Cute Kawaii Welcome Widget
Thanks for downloading our widget!
Here you will find instructions on how to set everything up and an in-depth description of its possibilities.
⚠️ Take note: This widget is hosted on StreamElements and works only with StreamElements donations — make sure you have a StreamElements account before setting it up!
Widget Installation
- Log in to StreamElements with your Youtube or Twitch account
- Go to the “2. Widget” folder in the package you’ve downloaded
Pick the file that corresponds to your streaming platform (Twitch or YouTube) and double-click to install it.
Voila! Your widget is installed!
Widget Customization
Pick your widget in your StreamElements dashboard and click “Edit”
Click on “Layers” and go to your widget.
- Go to the “Settings” tab
- Woohoo, here you can customize everything to your taste :)
⚠️ IMPORTANT
For all of your customizations to take effect, you need to press "Save" in the top right corner of the editor and refresh the page before adding the widget to your streaming software!
Customization Fields
Display Mode
These settings control the widget's fundamental behavior and visibility.
| Setting | Description |
|---|---|
| Display Mode | Choose how the widget appears: Automatic Pop-up , Command Triggered , Stream Events , or Always Visible . |
| Pop-up Frequency | (Automatic Mode Only) How often (in seconds) the widget should appear automatically. |
| Visibility Duration | (All modes except 'Always Visible') How long (in seconds) the widget stays on screen before hiding. |
Stream Events (Twitch Version)
This section is only active if Display Mode is set to Stream Events .
| Setting | Description |
|---|---|
| Show on Follow | Triggers the animation for new followers. |
| Show on Subscribe/Resub | Triggers for new subscribers and resubscribers. |
| Show on Gift Sub | Triggers when a viewer gifts a subscription. |
| Show on Raid | Triggers when another channel raids yours. |
| Show on Cheer | Triggers for cheers/bits. |
| Minimum Bits to Trigger | The minimum number of bits required to trigger the widget. |
| Show on Tip/Donation | Triggers for tips/donations made through StreamElements. |
| Minimum Tip Amount | The minimum tip amount ($) required to trigger the widget. |
| Event Cooldown | Minimum time (in seconds) between event triggers to prevent spam. |
Stream Events (YouTube Version)
This section is only active if Display Mode is set to Stream Events .
| Setting | Description |
|---|---|
| Show on New Subscription | Triggers for new (free) channel subscriptions. |
| Show on New Member/Renewal | Triggers for new paid members and renewals. |
| Show on Gifted Membership | Triggers when a viewer gifts a membership. |
| Show on Super Chat/Sticker | Triggers for Super Chats or Super Stickers. |
| Minimum Super Chat Amount | Minimum Super Chat value (in your currency) to trigger the widget. |
| Show on Tip/Donation | Triggers for tips/donations made through StreamElements. |
| Minimum Tip Amount | Minimum tip amount (in your currency) to trigger the widget. |
| Event Cooldown | Minimum time (in seconds) between event triggers to prevent spam. |
Command Mode
These settings are only active when Display Mode is set to Command Triggered .
| Setting | Description |
|---|---|
| Chat Command | The chat command that will trigger the widget (e.g., !welcome ). |
| Command Permissions | Restricts who can use the command. Options vary slightly between Twitch (VIPs , Subscribers ) and YouTube (Sponsors ). |
Content
Customize the text and images displayed on the widget.
| Setting | Description |
|---|---|
| User Picture | The main image/avatar shown in the circular frame. |
| Title Text | The large, primary text line. |
| Subtitle Text | The smaller text line below the title. |
| Info Text | The text that appears in the small info label/box. |
Widget Colors
Full control over the color palette of the widget.
| Setting | Description |
|---|---|
| Main Background Color | Background color of the main widget card. |
| Main Border Color | Color of the border around the main card. |
| Main Shadow Color | Color of the drop-shadow behind the main card. |
| Info Box Background Color | Background color of the info label (can be transparent). |
| Info Box Text Color | Text color inside the info label. |
| Title Text Color | Color of the main title text. |
| Subtitle Text Color | Color of the subtitle text. |
Typography
Google Font support with full size and weight control.
| Setting | Description |
|---|---|
| Title/Subtitle/Info Font | Choose a Google Font for each text element. |
| Title/Subtitle/Info Font Size | Set the font size for each text element. |
| Title/Subtitle/Info Font Weight | Set the font weight (e.g., 400 regular, 700 bold). |
| Global Font Family | A fallback font for any elements without specific fonts set. |
Layout & Sizing
Fine-tune the card's shape and proportions.
| Setting | Description |
|---|---|
| Main Box Corner Roundness | Roundness of the main card’s corners. |
| Info Label Corner Roundness | Roundness of the info label’s corners. |
Info Label Icon
Customize the small icon inside the info label.
| Setting | Description |
|---|---|
| Icon Type | Choose a preset icon (Heart , Star , Sparkle ) or Custom . |
| Custom Icon | (Custom Type Only) Upload your own image. |
| Icon Color | Sets the color of the preset icons. |
User Picture
Adjust the visual frame of the avatar.
| Setting | Description |
|---|---|
| Mask Shape | Choose a mask shape: Star , Heart , Circle , Square , Hexagon . |
| Border Color | Color of the border around the masked picture. |
Decorations
Floating visual effects like clouds, stars, or moons.
| Setting | Description |
|---|---|
| Moon/Star/Cloud Image | Replace default iconss with your own images. |
| Cloud/Star/Moon Fill Color | Fill color of default icons decorations. |
| Cloud/Star/Moon Stroke Color | Stroke (outline) color of default decorations. |
⚠️ IMPORTANT
For all of your customizations to take effect, you need to press "Save" in the top right corner of the editor and refresh the page before adding the widget to your streaming software!
How to Add it to the Streaming Software?
OBS Studio
- Copy the URL of your Widget from the StreamElements dashboard
- Open OBS Studio
- Click “Add Source” (plus icon) in the Sources section.
- Add a “Browser” source, give it a name, and press “Ok”
- Paste the URL you’ve copied
- Set the width to 1920 and the height to 1080
- Press “Ok” and we’re done!
Streamlabs Desktop
- Copy the URL of your Widget from the StreamElements dashboard
- Open Streamlabs Desktop
- Click “Add a new Source” (plus icon) in the Sources section.
- Choose “Browser Source”, give it a name, and press “Add Source”.
- Paste the URL you’ve copied previously
- Set the width to 1920 and the height to 1080
- Now press “Close” and that’s it! Your widget is ready to use!