# Debugging Environment Variables

> Use the Dev Tools to inspect and debug environment variables.

*Canonical: https://makerkit.dev/docs/nextjs-prisma/dev-tools/environment-variables*

---

The Dev Tools let you inspect environment variables, see validation errors, and compare effective values.

{% img src="/assets/images/dev-tools-env-variables.webp" width="1000"
height="600" /%}

## Getting Started

Run `pnpm dev`, then open `http://localhost:3010/variables`.

## Modes

- Development mode shows the values loaded for local development
- Production mode helps you inspect a local production-style env setup

## Debugging Production Values

If you need to debug production values locally:

1. copy the values from your hosting provider
2. place them in a local `.env.production.local`
3. inspect them in Production mode
4. delete the file or store it securely when done

## Extending the Tool

To add custom variables to the Dev Tools UI, update:

```text
apps/dev-tool/app/variables/lib/env-variables-model.ts
```