Technical Specification: Namespace-Based UUID Generator (v3 & v5)

Overview

This single-file web application serves as a deterministic utility to generate RFC 4122 compliant UUIDs (Version 3 and Version 5). Unlike random UUIDs (v4), v3 and v5 UUIDs allow developers to generate the same identifier given the same namespace and input name, which is critical for deduplication and resource referencing.

Core Features

• Algorithm Selection: Toggle between UUID v3 (MD5) and UUID v5 (SHA-1).
• Namespace Presets: Quick-select common namespaces (DNS, URL, OID, X500).
• Custom Namespace Support: Ability to input a custom UUID string as a namespace.
• Name Input: Real-time generation as the user types.
• In-Memory History: A session-based history table (non-persistent) allowing users to track recent generations without local storage.
• Copy Functionality: One-click copy to clipboard with non-intrusive UI feedback.
• Responsive Design: Mobile-first layout that adapts seamlessly to desktop or phone screens.

UI Layout

• Header: Simple, clean, centered header with tool title and a one-sentence descriptive subtitle.
• Main Interaction Panel:
  • Left/Top Column: Configuration area (Algorithm radio buttons, Namespace dropdown/input, Name input field).
  • Right/Bottom Column: Result display area with a large, monospaced font output and a prominent 'Copy' button.
• History Area: A collapsible or fixed-height table beneath the main generator showing the last 10 generated identifiers.
• UI Feedback: Toast-style notifications for actions like "Copied to Clipboard" (no browser-native alerts).

Aesthetic & Styling

• Palette:
  • Background: #F8FAFC (Light Gray/Blue tint)
  • Primary Accent: #2563EB (Professional Blue)
  • Text: #1E293B (Dark Slate for readability)
  • Card/Container: #FFFFFF with soft shadows (0 4px 6px -1px rgba(0, 0, 0, 0.1))
• Transitions: Smooth fade and slide animations for input changes and history updates.
• Accessibility: High-contrast text, proper label tagging for all inputs, and keyboard-navigable structure.

Technical Implementation Constraints

• Build: Pure HTML, CSS, and Vanilla JavaScript. No frameworks or external build tools.
• Libraries: Only lightweight CDNs (e.g., UUID-js library for hashing, Tailwind CSS for layout) permitted.
• Persistence: Strictly NO localStorage, sessionStorage, or cookies. The history list must be stored in a simple JavaScript Array variable and will wipe upon page refresh.
• Environment: The app must be compatible with a sandboxed iframe. Any external interactions (like opening GitHub links) must use target="_blank" and rel="noopener noreferrer".
• Feedback: All alerts, prompts, or notifications must be built using custom DOM elements (divs) rather than browser alert() or prompt() functions.