> For the complete documentation index, see [llms.txt](https://cypress.visual-image-diff.dev/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://cypress.visual-image-diff.dev/getting-started/reporting/cypress-image-diff-html-report.md).

# Cypress Image Diff HTML Report

From **Cypress Image Diff** version 2, **Cypress Image Diff HTML Report** is the recommended HTML report over the [Legacy HTML report](https://app.gitbook.com/o/boZ108LU5mrfWT6zkLtJ/s/ZyBQte7cOp75X6TWkWrZ/~/changes/17/getting-started/reporting/legacy-html-report). **Cypress Image Diff HTML Report** generates a beautiful HTML report out of a [JSON file](/getting-started/reporting/json-report.md), and offers extensive features:

* Update baseline screenshots
* Toggle between different screenshot inspector modes: carousel, slider, and mirror
* Select your preferred colour scheme

Once you've done the [integration part](/getting-started/cypress-integration.md), these quick command lines will be helpful:

* `cypress-image-diff-html-report start`: to serve the HTML report out of a generated JSON file in an interactive mode, where you can update the baseline screenshots.
* `cypress-image-diff-html-report generate`: to generate and write to disc the HTML report in case you just want to view the static report.

Or you could integrate the report programmatically:

```javascript
import { start } from 'cypress-image-diff-html-report'

;(async () => {
  await start({
    configFile: 'custom.config.js',
    serverPort: 3000
    // ...
  })
})()
```

[See here](https://github.com/kien-ht/cypress-image-diff-html-report) for more details about how to use Cypress Image Diff HTML Report.

<figure><img src="/files/j8a4eQlRIEl2c9cAJFDZ" alt=""><figcaption></figcaption></figure>

If you run the `generate` command, this following folder structure will be expected:

```
    .
    ├── cypress-image-diff-html-report
        ├── cypress-image-diff-html-report.html
        ├── report_[datetime].json
```