Skip to main content
Use PNG or WebP for final screenshots (recommended width 1200–1400px). Store files under docs/images/screenshots/ and reference them from MDX with <Frame>.
On macOS: Cmd+Shift+4 then Space to capture a window. Prefer demo accounts; avoid publishing real student PII when possible.

​
Screenshots in the docs (production)

Optional older captures still in the folder:
  • intake-archived-file.png — File Assignment for archived returning students
  • intake-success-legacy.png — replace with new success summary + P2G card after that UI is deployed

​
Nice-to-have next

​
Capture from production

Put credentials in .env as plain KEY=value lines (no wrapping quotes or trailing \). .env is gitignored. Re-capture dashboard and app-shell-sidebar after UI shell changes so Mintlify matches production.

​
How to add a screenshot

1

Capture the screenshot

Open the live app, navigate to the screen, and capture at full width.
2

Save the file

Save as docs/images/screenshots/your-name.png.
3

Update the MDX page

4

Preview and deploy

Run npm run docs:dev, verify locally, then push for Mintlify to deploy.

​
Mintlify Frame tips

From Mintlify Frames:
  • Always wrap screenshots in <Frame> for consistent borders and captions
  • Use caption for what the image shows; Markdown links are allowed in captions
  • Keep alt text specific (role + page + key UI elements)