Guides

How to Duplicate Modals and Drawer Frames in Retool

OTC Team··4 min read

If you've tried to duplicate modals and drawer frames in Retool, you already know the problem: there's no native duplicate button. Every time you need a new modal or drawer that follows the same layout or design pattern, you have to rebuild it from scratch — component by component, query by query. It's one of the most upvoted feature requests in the Retool community, and for good reason. Here's what's going on, what Retool has said about it, and the practical workarounds you can use today.

Why You Can't Duplicate Modals or Drawers in Retool (Yet)

As of now, Retool does not support a native duplicate action for Modal or Drawer frame components. While you can duplicate most standard components on the canvas, container-level frame components like modals and drawers are excluded from this functionality. This is a known gap, not a bug — Retool builds features iteratively, and this one hasn't shipped yet.

The Retool team has acknowledged the request internally and escalated it to the engineering team that owns this area of the product. Community members have been told to expect an update when it's implemented, but no firm timeline has been given. If this is blocking your workflow, you'll need a workaround in the meantime.

Why This Matters for Internal Tool Development

When you're building internal tools at scale, consistency matters. Design patterns — like a confirmation modal, a record detail drawer, or a form modal — get reused across dozens of apps. Without a duplicate feature, every new instance of a Modal or Drawer means:

  • Manually recreating the same layout and component structure
  • Re-wiring event handlers, queries, and state variables
  • Re-applying spacing, styling, and conditional visibility logic
  • Introducing inconsistencies between instances as the manual process scales

For teams maintaining multiple Retool apps, this is a real time sink and a source of technical debt. The lack of duplication support for frame components contradicts how most builders actually work — establishing a pattern once and replicating it.

Workarounds for Duplicating Modals and Drawers in Retool

Until native duplication ships, here are the most effective approaches to avoid rebuilding from scratch every time.

1. Copy the App JSON and Edit It Directly

Retool apps are stored as JSON under the hood. You can access this by going to your app, clicking the ... menu, and selecting Export app (or by using the Retool REST API to fetch the app definition). Inside the JSON, each Modal and Drawer is represented as a component tree. You can:

  • Find the JSON block for the modal or drawer you want to duplicate
  • Copy the entire object and paste it as a new entry in the components array
  • Update the name field to a unique identifier (e.g., change modal1 to modal2)
  • Re-import the modified JSON using Import app

This is the closest thing to a true duplicate and preserves all child components, layout, and most wiring. Be careful with query references — any query.trigger() calls or {{queryName.data}} bindings tied to the original modal may need to be updated to avoid conflicts.

2. Build a Reusable Module for Common Modal Patterns

If you're on a Retool plan that includes Modules, this is the cleanest long-term solution. A Module is a reusable component bundle you can drop into any app. Instead of duplicating a modal manually, you define it once as a Module — with configurable inputs, outputs, and event handlers — and reuse it everywhere.

  • Create a new Module from the Retool home screen
  • Build your Modal or Drawer pattern inside it
  • Expose the data it needs as Module inputs
  • Expose any triggers or callbacks as Module events
  • Drop the Module into any app that needs that pattern

This approach scales well and keeps your UI consistent across apps without any manual copying.

3. Use a Single Modal with Dynamic Content

If your use cases are similar enough, consider consolidating them into a single Modal that renders different content based on a state variable. Use a currentModalView variable (set via setState) to control which content block is visible inside the modal using conditional visibility on container components.

This reduces the total number of modals you need to maintain and sidesteps the duplication problem entirely for many common patterns.

What to Expect from Retool Going Forward

The Retool team has confirmed this is on their radar. Given how many upvotes and community posts the request has accumulated, it's likely to ship in a future release. When it does, expect a right-click or toolbar option to Duplicate a Modal or Drawer frame the same way you'd duplicate a standard component today.

Until then, the JSON edit method is your most powerful option for a one-time copy, and Modules are the right investment if you're building at scale. Either way, you don't have to keep rebuilding the same modal by hand.

Ready to build?

We scope, design, and ship your Retool app — fast.

Ready to ship your first tool?