# Highlighting

### Cells

Highlight a cell's text by using the `highlightCell` option which contains a `textColor` and a `func` property. The function receives the current cell as argument. Return `true` from it to highlight the given cell.

```javascript
import { Table } from 'voici.js'

const data = [
  { firstname: 'Homer', lastname: 'Simpson', age: 39 },
  { firstname: 'Marge', lastname: 'Simpson', age: 36 },
  { firstname: 'Bart', lastname: 'Simpson', age: 10 },
  { firstname: 'Lisa', lastname: 'Simpson', age: 8 },
  { firstname: 'Maggie', lastname: 'Simpson', age: 1 }
];

const config = {
  body: {
    highlightCell: {
      textColor: '#F39B6D',
      func: (cell) => cell === "Marge" || cell === "Maggie"
    }
  }
};

const table = new Table(data, config);
table.print();
```

![Console Output](https://1307571304-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOIf17OLFblxkTooTktmI%2Fuploads%2FYB708HbE82OxOEEvsPi9%2Fhighlight_cell.png?alt=media\&token=f1a0876b-ef12-4e96-bf4e-8be6e6d960c3)

Beside the `textColor`, you can also toggle whether the highlighted cell should be `bold`, `italic` or `underline`.

### Rows

Using the `highlightRow` option you can provide a `bgColor` and a `func`. The function receives the current row as argument. Return `true` from the function to highlight the row.

```javascript
import { Table } from 'voici.js'

const data = [
  { firstname: 'Homer', lastname: 'Simpson', age: 39 },
  { firstname: 'Marge', lastname: 'Simpson', age: 36 },
  { firstname: 'Bart', lastname: 'Simpson', age: 10 },
  { firstname: 'Lisa', lastname: 'Simpson', age: 8 },
  { firstname: 'Maggie', lastname: 'Simpson', age: 1 }
];

const config = {
  body: {
    highlightRow: {
      bgColor: '#4F5D75',
      func: (row) => row['age'] % 2 === 1
    }
  }
};

const table = new Table(data, config);
table.print();
```

![Console Output](https://1307571304-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOIf17OLFblxkTooTktmI%2Fuploads%2FiLv7aCoQRIxa5xHTrtYw%2Fhighlight_row.png?alt=media\&token=51fa2b90-c1f3-4a33-b9b7-c4f76fb02c45)