# Creating a More Complex Face

Create a professional-looking beveled edge in C1Gauge control by adding a couple shapes on top of one another and use gradients for a lighting effect.

## Content



The [Border](/componentone/docs/win/online-gauges/) property of all **FaceShapes** is nice and simple. We can create a more professional-looking beveled edge to our gauge by adding a couple shapes on top of one another and using gradients for a lighting effect. For this example we will have a total of three **Ellipses** in our **FaceShapes** collection.

<br />![FaceShapes collection](https://cdn.mescius.io/document-site-files/images/2003d53a-81bd-40aa-82c0-56cd09293e5d/imagesext/image12_10.png)

1.  Click the **ellipsis** button next to the [Gauges](/componentone/docs/win/online-gauges/) property in the Properties window. The **C1Gauge.Gauges Collection Editor** dialog box opens.
2.  Click the ellipsis button next to the [FaceShapes](/componentone/docs/win/online-gauges/) property. The **C1RadialGauge.FaceShapes Collection Editor** opens.
3.  Click **Add** and select [C1GaugeEllipse](/componentone/docs/win/online-gauges/). The first ellipse will be the bottom-most.
4.  Expand **Filling** and set the [Color](/componentone/docs/win/online-gauges/) property to **White**, [Color2](/componentone/docs/win/online-gauges/) property to **Black**, and [BrushType](/componentone/docs/win/online-gauges/) to **Gradient**. We need to make the bottom-most ellipse a bit bigger so we can see it when others are on top. To do this, set the [Width](/componentone/docs/win/online-gauges/) and [Height](/componentone/docs/win/online-gauges/) properties to **-1.08**. Note that a value of **-1** means 100% of the region. Values less than **-1** will increase the size proportionally. Positive values denote explicit sizes in pixels.
5.  Expand **Border** and set the [LineStyle](/componentone/docs/win/online-gauges/) property to **None**.
6.  Click **Add** and select C1GaugeEllipse. The second ellipse will be slightly smaller than the bottom.
7.  Set its Width and Height values to **-1.02**.
8.  Expand **Filling** and set the Color property to **Black**, Color2 property to **White**, and BrushType to **Gradient**.
9.  Expand **Border** and set the LineStyle property to **None**.
10.  Click **Add** and select C1GaugeEllipse. The third ellipse will act as our face plate directly beneath the scale and pointer. We will keep its **Width** and **Height** at **-1** (the default of 100%).
11.  Set the Color property to **DarkGray**, Color2 property to **DimGray** and BrushType to **Gradient**.
12.  Expand **Gradient** and set [Direction](/componentone/docs/win/online-gauges/) to **RadialInner**.
13.  Expand **Border** and set the LineStyle property to **None**.

## See Also

[Customizing the Pointer and Cap](/componentone/docs/win/online-gauges/gaugesforwinformstas/customizingthepointe)