# Skins

**RadToggleButton** uses **skins** to control its overall look and feel. A skin is a set of images and a CSS stylesheet that can be applied to the control elements and defines their look and feel.

To apply a skin to a **RadToggleButton** control, set its **Skin** property.

**RadToggleButton** is installed with a number of preset skins. These are shown below:

![RadToggleButton-skins](https://www.telerik.com/products/aspnet-ajax/documentation/assets/eb9546d5564bf7a2693ba2e1b59b6dc3/radtogglebutton-skins.png)

> note The **Material** skin is available for the [Lightweight RenderMode](https://docs.telerik.com/devtools/aspnet-ajax/controls/render-modes) only. If you experience visual issues with it, make sure your controls are not using the default Classic mode.

## Using Custom Images in a State

**RadToggleButton** allows the developer to use a [custom image for a state](https://www.telerik.com/products/aspnet-ajax/documentation/controls/togglebutton/functionality/image). Once this is done, the entire control is considered a custom image and it will no longer have the default push button appearance (border and backgrounds). Thus, if you mix push button states and image states, the push button states will look like plain text on the page.

## Customizing Skins

You can tweak the existing skins or create your own. See [Create a Custom Skin For RadToggleButton](https://www.telerik.com/products/aspnet-ajax/documentation/controls/togglebutton/appearance-and-styling/create-a-custom-skin) for a step-by-step walkthrough. To use your own skin:

1. Add the new CSS file to your project.

2. Drag and drop the CSS file from the Project Explorer onto your Web page.

3. Set the **EnableEmbeddedSkins** property of the control to **False**.

The stylesheet for a **RadToggleButton** skin has the name **Button.\[SkinName].css** and can be found in the **...Skins/\[SkinName]** directory. For example, the stylesheet for the "Black" skin is called Button.Black.css and is located in the ...Skins/Black directory.

## See Also

* [Create a Custom Skin](https://www.telerik.com/products/aspnet-ajax/documentation/controls/togglebutton/appearance-and-styling/create-a-custom-skin)

* [Image](https://www.telerik.com/products/aspnet-ajax/documentation/controls/togglebutton/functionality/image)