# Colors

You can change the text- and background color of the table.

{% hint style="warning" %}
All provided color strings must be in **hex** format.
{% endhint %}

### Example #1

Set a text- and background color for the body content.

```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: {
    bgColor: '#6184D8',
    textColor: '#d8b561'
  }
};

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%2FdSHOVc8mEM3IlLg415LD%2Fcolor_1.png?alt=media\&token=8834eaff-1ccb-40c9-8c0b-6ea611a59e64)

### Example #2

Set a text- and background color for the header content.

```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 = {
  header: {
    bgColor: '#6184D8',
    textColor: '#d8b561'
  }
};

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%2FDtv4B9WpcdGsUaNLo0wG%2Fcolors_2.png?alt=media\&token=5f45ef21-4e80-4992-87ec-2e224b8f0f8d)

### Example #3

Set a background color columns by column.

```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 = {
  bgColorColumns: ['#DF3B57', '#0F7173']
};

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%2FpYqE5AFdVJaiZXPy9oNE%2Fcolors_3.png?alt=media\&token=f4b065fe-8c5d-4c25-b001-d4fa0aa11acd)
