Configuration Steps
Customization is managed through the Smatvirtual Merchant Dashboard. No code changes are required on your end.- Log In: Access your account on the Merchant Dashboard.
- Navigate to Settings: Locate the Theme Customization section.
- Upload Logo: Provide a PNG or JPEG logo. This will appear within the game interface to reinforce your brand.
- Define Colors: Update the hex codes for the keys listed below.
- Preview & Save: Use the built-in preview tool to verify the look before pushing to production.
Theme Configuration Keys
The following keys control the CSS variables within the game iframe.Core Brand Colors
| Key | Default | Description |
|---|---|---|
primaryColor | #0D7B3C | Main theme color (buttons, links, highlights). |
secondaryColor | #0D7B3C | Secondary accent color. |
background | #373A45 | Main background color of the iframe. |
textColor | #FFFFFF | General text color used throughout. |
Button Styles
| Key | Default | Description |
|---|---|---|
playBtnBackground | #0D7B3C | Background color for the primary Play button. |
playButtonColor | #FFFFFF | Text color for the Play button. |
btnBorderRadius | 10px | Corner roundness (e.g., 0px for square, 20px for pill). |
Tournament Table Specifics
These keys are specific to our Flagship Tournament engine’s leaderboard and UI.| Key | Default | Description |
|---|---|---|
evenTournamentTable | #373A45 | Background for even rows in the standings. |
oddTournamentTable | #4B4E58 | Background for odd rows in the standings. |
tournamentBtnBackground | #0D7B3C | Action buttons within the tournament UI. |
Strategic Tips
Contrast for Accessibility
Ensure your
primaryTextColor has high contrast against your primaryColor
to keep the UI readable.Mobile Optimization
Keep logos simple. Highly detailed logos may become difficult to read on
smaller mobile game screens.
Advanced: Disabling the Game Lobby
If you prefer to navigate users through your own custom lobby, you can disable the smatvirtual default lobby view. Learn how to disable the Game LobbyNeed a Custom Theme? If our standard customization keys don’t meet your
specific branding requirements, contact
[email protected] to discuss
bespoke UI solutions.