Technical Specification: Free Online Bulk UUID Generator

Overview

A high-performance, single-file browser application designed for developers and database administrators to generate large batches of universally unique identifiers (UUIDs) in v1 or v4 formats. The tool prioritizes speed, clarity, and ease of use in a professional light-mode aesthetic.

Core Features

1. Multi-Format Generation: Toggle between UUID v4 (Random) and v1 (Time-based).
2. Batch Control: Select quantity (1 to 10,000) via a slider and numeric input.
3. Formatting Options:
   • Case toggles (Uppercase vs Lowercase).
   • Hyphenated vs Raw strings (strip hyphens).
   • Prefix/Suffix addition.
4. Copy & Export:
   • "Copy All" button with visual feedback.
   • Export as .txt or .csv file.
5. Performance: Asynchronous generation logic using Web Workers or chunked processing to prevent browser UI freezing during large batch generation.

UI Layout (Light Mode Only)

• Header: Clean, minimalist title with a short description. No branding.
• Control Panel: A sidebar or top-aligned grid containing inputs for quantity, version selection, and formatting rules.
• Action Area: Primary "Generate" button with a distinct blue brand-less primary color.
• Results Window: A scrollable, monospaced text area showing generated output with line numbers and a small toolbar (Copy, Download, Clear).
• Responsive Behavior: Stack controls vertically on mobile, show grid on desktop. Ensure max-width containers for readability.

Color Palette

• Primary: Indigo-600 (Actions/Buttons)
• Background: Neutral-50 (Near white)
• Surface: White (Cards/Panels)
• Text: Slate-800/900 (High readability)
• Borders: Slate-200

Developer Directives & Constraints

1. Single File: All HTML, Tailwind CSS (via CDN), and Vanilla JS must exist within one .html file.
2. No Storage: ABSOLUTELY NO localStorage, sessionStorage, cookies, or indexedDB. Application state must exist solely in memory. Refreshing clears the output.
3. Compatibility: Must function perfectly inside a null-origin sandboxed iframe. Use custom UI elements instead of alert() or prompt().
4. External Assets: Use Tailwind CSS via CDN. Icons can be pulled from a CDN library like Phosphor Icons or Heroicons.
5. Animations: Implement subtle transition-all on hover effects for buttons and opacity fades for the results generation to provide a premium feel.
6. Responsive Design: Use Tailwind CSS utility classes to ensure the layout remains functional on mobile devices (no horizontal overflow).
7. No Branding: Use generic, functional naming conventions for all internal identifiers and labels.