> For the complete documentation index, see [llms.txt](https://help.smartico.ai/welcome/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.smartico.ai/welcome/products/mini-games/using-images-instead-of-prize-names-in-spin-the-wheel.md). # Using images instead of prize names in Spin the Wheel You can enhance the visual appeal of your Spin the Wheel game by using images instead of text for prize names. This approach allows you to display complex prize names more clearly while making the game more engaging. {% hint style="success" %} For a detailed Figma template, please reach out to your Customer Success Manager! {% endhint %}

There are two ways to achieve this:\ \ **1st method: Adding images as prizes on the template level**

* First, create an image that includes the prize name and amount. * The image should be 186 x 90 px. * We recommend rotating the image 90° as shown in the example below. * When setting up the prize, enable the 'Replace Name with Image' toggle. * This method allows you to assign an image to each prize directly in the template. ### Image Specifications and Prize History Display * **Image Dimensions & Format:** The recommended resolution is 186 x 90 px in PNG format with transparency (or WebP), ensuring the sector background color remains visible. * **Orientation & Prize History:** The 90° clockwise rotation aligns the graphic radially with the wheel sector. When a user wins the prize, the widget automatically rotates the icon by 270° in the player's Prize History so it appears right-side up in lists and claim popups. * **Mixed Sectors:** You can enable 'Replace Name with Image' on select prizes while retaining standard text names and icons on other sectors within the same wheel.

**2nd method: Adding images as prizes on skin level**

{% hint style="success" %} With this method, you cannot dynamically change prize positions from the Prize Configuration, as the layout is fixed within the skin itself. {% endhint %} * This method allows for even greater customization by adding unique images to each sector of the wheel. You should upload the entire sector image along with the other images when adding the skin. * You can include a background, prize name, amount, icons, or other elements inside the image. * Spin the Wheel mini-games support between 3 and 10 sectors. When uploading a skin package, include full-wheel graphics named after the sector count (such as `6.png`, `8.png`, or `10.png`) corresponding to each sector configuration you plan to use. * You can also use the AI Wheel Design Creator directly in the Back-Office to generate complete wheel skin packages and preview designs across different sector counts automatically. * To apply this: * Leave the 'Prize Icon' field empty * Assign fixed images to each sector in the skin configuration * In the game template, match each prize to the correct sector * Apply custom CSS in the CSS editor within the game template to hide the Prize name ```css .saw-view .wheel-sector-name .sector-text { display: none; } ``` {% hint style="success" %} We can also provide a Figma template for Mini-games skins upon request. Please note that any images exported from the template must be compressed before uploading them to the Back-Office. You can use [this link](https://tinypng.com/) to compress your images. For further assistance, please contact your Customer Success Manager! For detailed instructions on preparing and uploading skin asset archives, see the [Custom skins for Mini-games](https://help.smartico.ai/welcome/products/mini-games/custom-skins-for-mini-games) guide, or visit [Game template setup](https://help.smartico.ai/welcome/products/mini-games/game-template-setup) for general template configuration. **What should I do if my prize images appear too large or blurry?** Ensure your images are exactly 186 x 90 px and saved in PNG or WebP format. Compressing images before uploading prevents rendering errors and ensures clean display across desktop and mobile viewports. **Can I mix text prizes and image prizes on the same wheel?** Yes. With template-level configuration (Method 1), the **Replace Name with Image** setting is configured per prize sector. You can use replacement images on high-value prizes and standard text labels on other sectors. **Why is prize text still visible over my custom skin wheel image?** If you designed custom wheel graphics with prize names baked into the skin (Method 2), apply the CSS rule `.saw-view .wheel-sector-name .sector-text { display: none; }` in the template CSS editor to hide the default text layer. {% endhint %} --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation by asking a question. Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters: ``` GET https://help.smartico.ai/welcome/products/mini-games/using-images-instead-of-prize-names-in-spin-the-wheel.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.