# Creating and Applying a Custom Style for Cells

Learn how you can customize the appearance of a cell or range of cells (or rows or columns) by applying a style to it using Spread for ASP.NET.

## Content

You can quickly customize the appearance of a cell or range of cells (or rows or columns) by applying a style, which is a set of appearance settings defined in a single [StyleInfo](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.StyleInfo.html) object. You can create your own style and save it to use again, similar to a template. The style includes appearance settings that apply to cells, such as background color, text color, font, borders, and cell type. For more information, refer to the [StyleInfo](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.StyleInfo.html) object.

> !type=note
> **Note:** The word "appearance" is used to refer to the general look and feel of the cell, not the Appearance class, which is used for the appearance of several parts of the interface.

A cell style includes the following appearance settings:

* text alignment of cell contents
* border colors, border style, border width and which sides have them
* cell colors
* font for text in cell
* margins
* cell type

You can specify the style for a cell by setting the [StyleName](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.Cell.StyleName.html) property for the [Cell](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.Cell.html) object.
A style can be applied to any number of cells. Just as a skin can be applied to a sheet, so a style can be applied to cells. You typically set the style for the cell by using the [StyleName](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.Cell.StyleName.html) property to define which [StyleInfo](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.StyleInfo.html) object is used by that cell. When you set the style ([StyleName](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.Cell.StyleName.html)), you set the entire [StyleInfo](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.StyleInfo.html) object in the style model for each cell in the range to the one in the NamedStyleCollection with the specified name.
You can also use the [ParentStyleName](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.Cell.ParentStyleName.html) property to set a style for a range of cells that may individually have different [StyleName](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.Cell.StyleName.html) values set but which all inherit a common set of appearance settings from a parent style. A cell inherits all the style information from the parent style ([ParentStyleName](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.Cell.ParentStyleName.html)). When you set the parent style, you are setting the Parent property of the StyleInfo object assigned to each cell in the range. The parent for a named style can also be set by the [Parent](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.NamedStyle.Parent.html) property of the [NamedStyle](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.NamedStyle.html) object. So different cells (cells in different rows or columns) may have different named styles but have the same parent style. For example, the cells may have different text colors (set in the named style) but inherit the same background color (set in the parent style). The default parent style is set in the [DataAreaDefault](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.DefaultStyleCollection.DataAreaDefault.html) field in the [DefaultStyleCollection](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.DefaultStyleCollection.html) class. For more information on the order of inheritance, refer to [Object Parentage](/spreadnet/docs/latest/online-asp/overview/spweb-devguide/spweb-concepts/spweb-oviewconcepts/spweb-knowObjParentage).
You can also create and apply appearance settings to an entire sheet by using sheet skins. For instructions on creating sheet skins, see [Creating a Skin for Sheets](/spreadnet/docs/latest/online-asp/overview/spweb-devguide/spweb-appearSet/spweb-appearSheet/spweb-SheetSkinCreate).

## Using the Property Window

1. In the **Form** window, click the FpSpread component for which you want to create the style in the NamedStyleCollection. For the FpSpread component, in the **Appearance** category, select the **NamedStyles** property.
2. Click on the button to launch the **NamedStyleCollection Editor**.
3. In the **NamedStyleCollection Editor**, click the **Add** button.
4. Set the properties in the **Named Style Properties** list to create the style you want.
5. Set the **Name** property to specify the name for your custom style.
6. Click **OK** to close the editor.
7. Select the cells (or rows or columns) to apply the style to.
8. In the property window, set the **StyleName** to the custom named style previously added.

## Using Code

1. Create the style using the [NamedStyle](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.NamedStyle.html) object constructor and set the style properties.
2. Add the styles.
3. Set the [StyleName](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.Cell.StyleName.html) property to assign the style to the cells.

## Example

This example code creates several styles and sets a parent style. This causes the cells to display the same background color but, different text colors.

```csharp
\\ Create a style with a blue background color.
FarPoint.Web.Spread.NamedStyle backstyle = new FarPoint.Web.Spread.NamedStyle("BlueBack");
backstyle.BackColor = Color.Blue;
\\ Create a style with an orange text color and assign it a parent style.
FarPoint.Web.Spread.NamedStyle text1style = new FarPoint.Web.Spread.NamedStyle("OrangeText", "BlueBack");
text1style.ForeColor = Color.Orange;
\\ Create a style with a yellow text color and assign it a parent style.
FarPoint.Web.Spread.NamedStyle text2style = new FarPoint.Web.Spread.NamedStyle("YellowText", "BlueBack");
text2style.ForeColor = Color.Yellow;
FpSpread1.NamedStyles.Add(backstyle);
FpSpread1.NamedStyles.Add(text1style);
FpSpread1.NamedStyles.Add(text2style);
FpSpread1.ActiveSheetView.Cells[0,0,2,0].StyleName = "OrangeText";
FpSpread1.ActiveSheetView.Cells[0,1,2,1].StyleName = "YellowText";
```

```vbnet
' Create a style with a blue background color.
Dim backstyle As New FarPoint.Web.Spread.NamedStyle("BlueBack")
backstyle.BackColor = Color.Blue
' Create a style with an orange text color and assign it a parent style.
Dim text1style As New FarPoint.Web.Spread.NamedStyle("OrangeText", "BlueBack")
text1style.ForeColor = Color.Orange
' Create a style with a yellow text color and assign it a parent style.
Dim text2style As New FarPoint.Web.Spread.NamedStyle("YellowText", "BlueBack")
text2style.ForeColor = Color.Yellow
FpSpread1.NamedStyles.Add(backstyle)
FpSpread1.NamedStyles.Add(text1style)
FpSpread1.NamedStyles.Add(text2style)
FpSpread1.ActiveSheetView.Cells(0,0,2,0).StyleName = "OrangeText"
fpSpread1.ActiveSheetView.Cells(0,1,2,1).StyleName = "YellowText"
```

## Using the Spread Designer

1. Select the **Settings** menu.
2. Select the **Named Style** icon under the **Appearance Settings** section.
3. Use the **New** style icon to create a new style and use the **Edit** style icon to set properties for the style.
4. Select **Apply** and **OK**.
5. Select the cell or cells and set the **StyleName** property.
6. From the **File** menu choose **Apply and Exit** to apply your changes to the component and exit Spread Designer.