← All references

Retool — Data Dashboard Product

Data / Dashboard

Show-the-product density: real dashboards, tables, and UI as the hero visual.

Retool — Data Dashboard Product preview
Mood
Capable, dense, credible, no-nonsense. Sells by showing the actual product.
Colors
Clean light base, neutral grays, one confident primary (indigo/blue), plus data-viz accent hues in charts. Professional, low-drama.
Type
Clean UI sans (Inter-like), tight functional hierarchy, mono for data/code. Legibility over flair.
Layout
Hero dominated by a realistic product screenshot/app frame (dashboards, tables, charts), feature rows each anchored by a real UI shot, integration logos.
Motion
UI panels animate/swap to demo capability, cursor-driven demos, subtle chart draw-ins. Motion demonstrates function.
Texture
Crisp app frames with soft shadow, bordered cards, real charts/tables, gridlines. Product-realistic.
Imagery
Show the product: realistic dashboards, tables, and charts. Tool: build real UI components in code where possible; GPT-Image for polished UI screenshots; charts coded (SVG). Product-realistic, low-drama.
Don't
No vague abstract hero art, no hiding the product, no playful clutter. Show real UI and data.

Use in a session

retool-dashboard

Tell Claude: build [my thing] using swipe ref retool-dashboard

Full recreation prompt

Recreate a landing page in the "Retool — Data Dashboard Product" style (Data / Dashboard). This is a VIBE / STYLE-TRANSFER task, not a clone: apply the design DNA below to MY content and section structure, do not copy the reference's copy or exact layout.

Design DNA:
- Mood: Capable, dense, credible, no-nonsense. Sells by showing the actual product.
- Colors: Clean light base, neutral grays, one confident primary (indigo/blue), plus data-viz accent hues in charts. Professional, low-drama.
- Typography: Clean UI sans (Inter-like), tight functional hierarchy, mono for data/code. Legibility over flair.
- Layout: Hero dominated by a realistic product screenshot/app frame (dashboards, tables, charts), feature rows each anchored by a real UI shot, integration logos.
- Motion: UI panels animate/swap to demo capability, cursor-driven demos, subtle chart draw-ins. Motion demonstrates function.
- Texture: Crisp app frames with soft shadow, bordered cards, real charts/tables, gridlines. Product-realistic.
- Avoid: No vague abstract hero art, no hiding the product, no playful clutter. Show real UI and data.

Imagery (generate real assets, do not use placeholders): Show the product: realistic dashboards, tables, and charts. Tool: build real UI components in code where possible; GPT-Image for polished UI screenshots; charts coded (SVG). Product-realistic, low-drama.

Reference exemplar: https://retool.com. Build the page around the content I give you next, faithfully channeling this aesthetic, and generate the matching imagery described above.

Reference exemplar

https://retool.com ↗