Response Details (ID: 113 - UIGEN-X-4B-0729)

Text Before HTML:

We are building a project management tool similar to Jira. The key features to include are:
 - Epics, sprints, and backlog
 - Drag-and-drop prioritization
 - Custom workflows

 We'll use Tailwind CSS for styling and structure. We'll design a clean, modern interface with a focus on functionality.

 Steps:
 1. Define the color scheme. We'll choose a professional color scheme suitable for a project management tool.
    - Primary: Indigo (for accents and buttons)
    - Background: Light gray for the main background, white for cards
    - Text: Dark gray for headings, medium gray for body

 2. Structure:
    - Header: Logo, navigation (Dashboard, Projects, etc.), user profile
    - Sidebar: Project selection, filters, etc.
    - Main Content: 
        * Epics (as large cards)
        * Sprints (as horizontal cards or a list)
        * Backlog (a list of tasks)
        * Ability to drag and drop tasks to change their status (backlog, sprint, epic)
        * Custom workflows (could be a separate page or modal)

 3. We'll use a two-column layout for the main content: left for sidebar, right for the project board.

 4. We'll use JavaScript for drag-and-drop functionality.

 5. We'll use Tailwind classes for styling.

 Let's start by setting up the HTML structure.

 Note: We are not using any framework, so we'll use plain HTML, CSS, and JavaScript.

 We'll create:
   - A header with logo and user profile
   - A sidebar with project list and filters
   - A main content area with:
        * A section for Epics (as large cards)
        * A section for Sprints (as horizontal cards)
        * A section for Backlog (as a list)

 6. For drag-and-drop, we'll use the HTML5 drag and drop API.

 7. We'll also include a button to create new items.

 Let's code accordingly.


# Project Management Tool with Jira-like Features

I'll create a comprehensive project management tool with epics, sprints, backlog, drag-and-drop prioritization, and custom workflows using Tailwind CSS.

Generated HTML Page:

Text After HTML:

## Key Features Implemented

1. **Project Management Dashboard**:
   - Clean, professional interface with a blue/indigo color scheme
   - Stats cards showing project metrics
   - Responsive layout that works on all devices

2. **Project Organization**:
   - Project sidebar with active projects
   - Kanban board with Backlog, Sprint, In Progress, and Done columns
   - Task cards with priority indicators and assignees

3. **Advanced Features**:
   - Drag-and-drop prioritization between columns
   - Custom workflows visualization
   - Epic management with progress tracking
   - Team member assignment and due dates

4. **Visual Design**:
   - Clean, modern UI with Tailwind CSS
   - Color-coded priority indicators
   - Card-based layout with subtle hover effects
   - Consistent spacing and typography

The interface is fully functional with drag-and-drop capabilities and includes all the key features of a project management tool like Jira. The design is clean, professional, and focused on usability.