# RatingStyle
Canonical page: https://www.adaptabletools.com/docs/reference/ratingstyle
Styles a numeric column as a row of icons whose fill represents the
cell value on a 0..`Max` scale.
Conceptually similar to a Percent Bar but with a discrete, instantly
legible visual idiom (★★★☆☆) commonly used for ratings, satisfaction
scores and review-style cells.
The cell value is clamped to `[0, Max]`. When `AllowHalf` is true (the
default) the icon at the boundary is rendered with a partial fill that
matches the fractional part of the value; otherwise the value is
rounded to the nearest whole icon.
```ts title="TypeScript"
export interface RatingStyle
```
## Properties
| Property | Type | Description | Default |
| --- | --- | --- | --- |
| [AllowHalf](https://www.adaptabletools.com/docs/reference/ratingstyle.md#allowhalf) | `boolean` | Controls **partial icons** for fractional values after clamping to
`[0, Max]` — not scaling between different ranges (e.g. 10-point vs
5-star).
When `true`, the decimal part fills part of the next icon (e.g. `3.5`
with `Max: 5` → three full icons + one half-filled + one empty).
When `false`, the clamped value is rounded with `Math.round` before
drawing, so only whole icons appear. | true |
| [Cell](https://www.adaptabletools.com/docs/reference/ratingstyle.md#cell) | [`CellBoxStyle`](https://www.adaptabletools.com/docs/reference/cellboxstyle.md) | Optional cell box styling (background colour, border, border radius)
applied to the cell behind the rating icons.
When set, this property "claims" the Cell slice for the column: any
Format Column matching this column has its Cell-box properties stripped
(so a Format Column `BackColor` cannot tint the cell behind a Rating).
When unset, Format Column Cell properties inherit through normally —
useful for tinting a row of stars to match a Format Column theme. | |
| [EmptyColor](https://www.adaptabletools.com/docs/reference/ratingstyle.md#emptycolor) | `string` | Outline / fill colour for the inactive portion of the rating.
Drawn as a subtle background icon so the user can see the maximum
possible rating at a glance even when the cell value is low. | a low-opacity tint of the current text colour. |
| [FilledColor](https://www.adaptabletools.com/docs/reference/ratingstyle.md#filledcolor) | `string` | Fill colour for the active (filled) portion of the rating. | 'var(--ab-color-warn, #f5a623)' — a warm amber that
reads well on both light and dark themes. |
| [Gap](https://www.adaptabletools.com/docs/reference/ratingstyle.md#gap) | `number` | Pixel gap between adjacent icons. | 2 |
| [Icon](https://www.adaptabletools.com/docs/reference/ratingstyle.md#icon) | [`RatingIconShape`](https://www.adaptabletools.com/docs/reference/ratingiconshape.md) | Icon used for each rating mark. | 'Star' |
| [Max](https://www.adaptabletools.com/docs/reference/ratingstyle.md#max) | `number` | Number of icons per cell **and** the upper bound of the rating scale,
in the **same numeric units as the cell value**.
The renderer clamps the cell value to `[0, Max]` and maps that number
directly to filled icons (e.g. `Max: 5` and value `4` → four units of
fill across five icons — roughly four stars, not “4 out of 10 scaled
to five stars”). Values above `Max` show as fully filled; values below
`0` show as empty.
To show a 1–10 score as five stars, use a calculated column (e.g.
`value / 2`) or set `Max` to match your data range (e.g. `Max: 10`
for ten icons), unless a future `ScaleMin` / `ScaleMax` option is added. | 5 |
| [ShowValue](https://www.adaptabletools.com/docs/reference/ratingstyle.md#showvalue) | `boolean` | When `true`, the numeric cell value is also displayed alongside the
icons (e.g. `★★★★☆ 4.2`). Useful when precise scores matter beyond
the visual approximation. | false |
| [Size](https://www.adaptabletools.com/docs/reference/ratingstyle.md#size) | `number` | Icon size in pixels (each icon is square). The renderer keeps the
row of icons vertically centred regardless of cell height. | 14 |
| [ToolTipText](https://www.adaptabletools.com/docs/reference/ratingstyle.md#tooltiptext) | [`CellTextOptions`](https://www.adaptabletools.com/docs/reference/celltextoptions.md) | Optional AG Grid tooltip content — `CellValue` and/or `PercentageValue`.
`PercentageValue` is the clamped cell value as a percent of `Max`
(`clamp(value, 0, Max) / Max`, same scale as the icon fill). | |
## Property Details
### AllowHalf
Controls **partial icons** for fractional values after clamping to
`[0, Max]` — not scaling between different ranges (e.g. 10-point vs
5-star).
When `true`, the decimal part fills part of the next icon (e.g. `3.5`
with `Max: 5` → three full icons + one half-filled + one empty).
When `false`, the clamped value is rounded with `Math.round` before
drawing, so only whole icons appear.
```ts title="TypeScript"
AllowHalf?: boolean;
```
###### Default Value
true
###### Property Value
`boolean`
### Cell
Optional cell box styling (background colour, border, border radius)
applied to the cell behind the rating icons.
When set, this property "claims" the Cell slice for the column: any
Format Column matching this column has its Cell-box properties stripped
(so a Format Column `BackColor` cannot tint the cell behind a Rating).
When unset, Format Column Cell properties inherit through normally —
useful for tinting a row of stars to match a Format Column theme.
```ts title="TypeScript"
Cell?: CellBoxStyle;
```
###### Property Value
[`CellBoxStyle`](https://www.adaptabletools.com/docs/reference/cellboxstyle.md)
### EmptyColor
Outline / fill colour for the inactive portion of the rating.
Drawn as a subtle background icon so the user can see the maximum
possible rating at a glance even when the cell value is low.
```ts title="TypeScript"
EmptyColor?: string;
```
###### Default Value
a low-opacity tint of the current text colour.
###### Property Value
`string`
### FilledColor
Fill colour for the active (filled) portion of the rating.
```ts title="TypeScript"
FilledColor?: string;
```
###### Default Value
'var(--ab-color-warn, #f5a623)' — a warm amber that
reads well on both light and dark themes.
###### Property Value
`string`
### Gap
Pixel gap between adjacent icons.
```ts title="TypeScript"
Gap?: number;
```
###### Default Value
2
###### Property Value
`number`
### Icon
Icon used for each rating mark.
```ts title="TypeScript"
Icon?: RatingIconShape;
```
###### Default Value
'Star'
###### Property Value
[`RatingIconShape`](https://www.adaptabletools.com/docs/reference/ratingiconshape.md)
### Max
Number of icons per cell **and** the upper bound of the rating scale,
in the **same numeric units as the cell value**.
The renderer clamps the cell value to `[0, Max]` and maps that number
directly to filled icons (e.g. `Max: 5` and value `4` → four units of
fill across five icons — roughly four stars, not “4 out of 10 scaled
to five stars”). Values above `Max` show as fully filled; values below
`0` show as empty.
To show a 1–10 score as five stars, use a calculated column (e.g.
`value / 2`) or set `Max` to match your data range (e.g. `Max: 10`
for ten icons), unless a future `ScaleMin` / `ScaleMax` option is added.
```ts title="TypeScript"
Max?: number;
```
###### Default Value
5
###### Property Value
`number`
### ShowValue
When `true`, the numeric cell value is also displayed alongside the
icons (e.g. `★★★★☆ 4.2`). Useful when precise scores matter beyond
the visual approximation.
```ts title="TypeScript"
ShowValue?: boolean;
```
###### Default Value
false
###### Property Value
`boolean`
### Size
Icon size in pixels (each icon is square). The renderer keeps the
row of icons vertically centred regardless of cell height.
```ts title="TypeScript"
Size?: number;
```
###### Default Value
14
###### Property Value
`number`
### ToolTipText
Optional AG Grid tooltip content — `CellValue` and/or `PercentageValue`.
`PercentageValue` is the clamped cell value as a percent of `Max`
(`clamp(value, 0, Max) / Max`, same scale as the icon fill).
```ts title="TypeScript"
ToolTipText?: CellTextOptions;
```
###### Property Value
[`CellTextOptions`](https://www.adaptabletools.com/docs/reference/celltextoptions.md)