# Trend

The Trend components used to display trends based on the given data. An up or down arrow will be displayed in the colors configured by the user.

#### Default Component Image:

<div align="left"><img src="https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FUFjhVTTdUCxG3PkQG0Uq%2FDefault%20design.png?alt=media&#x26;token=3f702e8d-abb2-43a9-bdb6-347991090256" alt=""></div>

#### Properties of the Trend:

* **Background:** The user can get the reflection of the chart by enabling the shadow option can also change the color and increase & decrease the transparency of the shadow.
* **General:** The user can change the height, width, top, and left values.   If initial visibility is not enabled, then the chart won’t be available for the first preview. The user can change the ‘Value' filed and ‘Base Range’ and based on that the trend color will get updated.

#### General Properties:

<div align="left"><img src="https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FERSVtNrFpE4wIkCOfhhD%2FGeneral%20properties.png?alt=media&#x26;token=d4c1cc80-27aa-405e-9c1b-d0d2ce628844" alt=""></div>

#### Background Properties:

<div align="left"><img src="https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FJcr5jyJXkwVxRRC12qzP%2FBackground%20proerties.png?alt=media&#x26;token=2b682ed2-43c7-466b-82fc-6b3e6da3f9f8" alt=""></div>

#### Modified URL after changing its properties:

#### Positive

<div align="left"><img src="https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FDx55H4gNcrQTRKEXLqfA%2Fpositive.png?alt=media&#x26;token=655a0e65-6993-464c-825d-4ddaf4c6d976" alt=""></div>

#### Zero

<div align="left"><img src="https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2Fq3zZqA59GN3DEzOtUPMv%2Fzero.png?alt=media&#x26;token=83fe1086-d8d9-4123-9320-97d521707358" alt=""></div>

#### Negative

<div align="left"><img src="https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2F009z32KyLC2iWDhmcfDA%2FNegative.png?alt=media&#x26;token=ab6173b6-7e26-439e-9380-ea4106df35e8" alt=""></div>

&#x20;