# Customize Axes

FlexChart supports customization of  axes. Learn more about the FlexChart axes customization in MVC documentation.

## Content



An axis is composed of several elements, such as labels, line, tick marks and titles. There are several properties available in FlexChart that let you customize these elements, for both X and Y axes. You can even change the position of the axes with the help of **Position** property.

The image below shows a FlexChart with customized axes.

![Customizing axes in FlexChart](https://cdn.mescius.io/document-site-files/images/2b3ac322-100e-4637-958d-fb40dcda3f44/images/chartaxes.png)

The following code example demonstrates how to set this property. This example uses the sample created in the [Quick Start](/componentone/docs/mvc/online-mvc/workwithcontrols/FlexChart/QuickStart) section.

```razor
.AxisY(axis => axis
       .Position(C1.Web.Mvc.Chart.Position.Right)
       .MajorGrid(true).MajorUnit(20)
       .AxisLine(true)
       .Labels(true)
       .Title("Sales in Dollars")
    )
.AxisX(axis=>axis
       .Position(C1.Web.Mvc.Chart.Position.Top)
       .AxisLine(true)
       .MajorGrid(true)
       .MajorUnit(20)
       .MinorGrid(true)
       .Labels(true)     
       .Title("Date")
       .Format("MMM-dd")
    )
```