---
title: Creating skins using ASP.NET themes
---

> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).

When creating styles for your websites, you can leverage the built-in support for [ASP.NET themes](http://msdn.microsoft.com/en-us/library/ykzx33wh.aspx). You can use themes to set styles for web parts or controls that do not have their own CSS class name, such as the Datagrid or Calendar.

Themes must be defined in a folder located under the **App\_Themes** directory. The name of this folder needs to be the same as the code name of the used CSS stylesheet. For example, if you use the _Green_ stylesheet on your site, your themes must be stored in the _App\_Themes\Green_ sub-folder.

Skins for your controls need to be added to the **Default.skin** file under this folder. For example, the following is a skin for the **CMSCalendar** control / **Calendar** web part:

```html

<cms:CMSCalendar Runat="server">
     <NextPrevStyle ForeColor="Red"></NextPrevStyle>
     <WeekendDayStyle BackColor="#E0E0E0"></WeekendDayStyle>
</cms:CMSCalendar>

```

## Website design files

It is recommended to store all image files, flash movies and other resources that are part of the website design template under the theme folder of the stylesheet that uses them. This ensures that the files are exported together with the stylesheet if you deploy it to another server.

You can manage the content of a stylesheet's theme folder directly from the administration interface in the **CSS stylesheets** application. Edit () the given stylesheet and switch to the **Theme** tab.

![Managing the theme folder of a CSS stylesheet](https://docs.kentico.com/docsassets/k82/creating-skins-using-asp-net-themes/CSS_Themes.png "Managing the theme folder of a CSS stylesheet")

Only file formats commonly used by CSS stylesheets are displayed here. This includes files with the following extensions: **.css**, **.skin**, **.gif**, **.png**, **.bmp**, **.jpg**

Text files (.css or .skin) can be modified using an editor with syntax highlighting support and images are opened in the built‑in [image editor](https://docs.kentico.com/k82/managing-website-content/working-with-files/editing-images.md).

### Folders for individual component styles

CSS and image files may also be stored separately for the CSS styles assigned to the page components described in the [Adding CSS stylesheets to page components](https://docs.kentico.com/k82/developing-websites/designing-websites-using-css/adding-css-stylesheets-to-page-components.md) topic. The theme folders of these components are located under the **App\_Themes\Components** directory. Further sub‑folders depend on the type of the component:

- **WebParts\\**
- **WebParts\\\Layouts\\**
- **Containers\\**
- **Transformations\\\\**
- **Layouts\\**
- **PageTemplates\\**

Just like for stylesheets, it is recommended to store all required files in the appropriate theme folder for each component. The system automatically exports and imports the files in the theme folders along with the objects representing the given component.

You can manage the content of the theme folders directly in the administration interface on the **Theme** tab, which is available when editing any type of component.