Back to Library
SaaS Dashboard

Admin Panel — CRUD Interface

Full-featured admin panel with data table, create/edit forms, filters, and bulk actions.

Compatible with:

cursorclaudelovable
Create an admin panel CRUD interface with these features:

HEADER:
- Page title
- "Create New" button (top right)
- Breadcrumb navigation

FILTERS & SEARCH:
- Search bar (left side)
- Filter dropdowns (Status, Category, Date range)
- "Clear filters" button
- Results count display

DATA TABLE:
- Checkbox column for bulk selection
- Columns: ID, Name, Status, Category, Created Date, Actions
- Sortable column headers
- Status badges (color-coded)
- Action buttons: Edit, Delete, View
- Hover state on rows
- Pagination controls (bottom)
- Items per page selector

BULK ACTIONS:
- Appears when items are selected
- Actions: Delete, Export, Change Status
- Confirmation modal for destructive actions

CREATE/EDIT MODAL:
- Overlay modal (centered)
- Form fields based on your data model
- Validation messages
- Save and Cancel buttons
- Loading state on save

DELETE CONFIRMATION:
- Warning modal
- "Are you sure?" message
- Cancel and Confirm buttons
- Destructive action styling (red)

STYLING:
- Professional, clean design
- Consistent spacing
- Clear visual hierarchy
- Accessible color contrast
- Responsive table (horizontal scroll on mobile)

How to Use

  1. 1Click the "Copy Prompt" button above
  2. 2Open your AI tool (Cursor, v0, Lovable, ChatGPT, or Claude)
  3. 3Paste the prompt and let the AI generate your UI
  4. 4Customize the output to match your brand and content

💡 Tips

Adapt the columns to your data model. Add proper form validation. Implement real API calls for CRUD operations.

Related Prompts