How to Generate UUID in JavaScript and Node.js

JavaScript has two paths to UUID generation: the built-in crypto.randomUUID() available in Node.js 14.17+ and all modern browsers, and the uuid npm package for legacy support or additional UUID versions. Here is every method with working code and a clear recommendation for each scenario.

crypto.randomUUID() — The Modern Standard

crypto.randomUUID() is built into Node.js (v14.17.0+) and all modern browsers. No package, no import, zero dependencies.

// Node.js 14.17+ — no import needed
const id = crypto.randomUUID();
console.log(id);
// Output: '550e8400-e29b-41d4-a716-446655440000'

// Browser (Chrome 92+, Firefox 95+, Safari 15.4+)
const id = crypto.randomUUID();
console.log(id);
// Same output

// In ESM / TypeScript
import crypto from 'node:crypto';
const id = crypto.randomUUID();

This is the recommended approach for any project running Node.js 14.17+ or targeting modern browsers. It uses the OS cryptographic random source — same security as the uuid package, zero overhead.

uuid npm Package — For Legacy Support or UUID v1/v5/v7

Install with npm install uuid or yarn add uuid.

// ESM (Node.js with type: module, or bundled frontend)
import { v4 as uuidv4, v7 as uuidv7 } from 'uuid';

const id_v4 = uuidv4();
console.log(id_v4);
// '550e8400-e29b-41d4-a716-446655440000'

const id_v7 = uuidv7();
console.log(id_v7);
// Time-ordered: '01956b13-f000-7xyz-...'

// CommonJS (older Node.js without ESM)
const { v4: uuidv4 } = require('uuid');
const id = uuidv4();

// UUID v5 — deterministic from string
const { v5 as uuidv5 } = require('uuid');
const MY_NAMESPACE = uuidv4(); // generate once, store
const id = uuidv5('my-stable-identifier', MY_NAMESPACE);

Use the uuid package when: you need v7 (time-ordered), v5 (deterministic), or you need to support environments older than Node.js 14.17.

Sell Custom Apparel — We Handle Printing & Free Shipping

UUID in React and Frontend Frameworks

// React — generate UUID on component mount (correct pattern)
import { useState, useEffect } from 'react';

function Component() {
  const [id] = useState(() => crypto.randomUUID());
  // useState initializer runs once — stable ID for the component's life
  return <div data-id={id}>...</div>;
}

// NOT recommended — generates new UUID on every render
function BadComponent() {
  const id = crypto.randomUUID(); // rerenders = new IDs
  return <div data-id={id}>...</div>;
}

// As a key for list items — use data-driven IDs, not random
// Random keys cause React to unmount/remount on rerenders
// Only use UUID keys for truly new items being added
const [items, setItems] = useState([]);
const addItem = () => {
  setItems(prev => [...prev, { id: crypto.randomUUID(), label: 'New item' }]);
};

UUID Without Dashes in JavaScript

// Remove dashes from any UUID string
const uuid = crypto.randomUUID();
const noDashes = uuid.replace(/-/g, '');
console.log(noDashes);
// '550e8400e29b41d4a716446655440000'

// Uppercase without dashes
const upper = crypto.randomUUID().replace(/-/g, '').toUpperCase();
console.log(upper);
// '550E8400E29B41D4A716446655440000'

// Using uuid package
import { v4 as uuidv4 } from 'uuid';
const opts = { disableEntropyCache: false };
const raw = uuidv4(null, Buffer.alloc(16));
// Or simply: uuidv4().replace(/-/g, '')

The standard UUID format uses hyphens. Strip them only if your system requires compact IDs — database fields, tokens where you control both ends. Always store the canonical hyphenated form in databases that have native UUID types.

TypeScript Types for UUID

// TypeScript — branded type for UUID
type UUID = string & { readonly __brand: 'UUID' };

function generateUUID(): UUID {
  return crypto.randomUUID() as UUID;
}

// Validate a string is a UUID
function isUUID(s: string): s is UUID {
  return /^[0-9a-f]{8}-[0-9a-f]{4}-4[0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i.test(s);
}

// Type from uuid package (v8+)
import type { UUID as UUIDType } from 'crypto';
// Built-in in Node.js 19+ type definitions

The uuid npm package ships its own types. For crypto.randomUUID(), the return type is already string in the built-in TypeScript lib. The branded type pattern above lets TypeScript distinguish UUID strings from plain strings at compile time.

Need a test UUID right now? The WildandFree UUID Generator generates one in your browser instantly.

Frequently Asked Questions

Should I use crypto.randomUUID() or the uuid npm package?

For Node.js 14.17+ or modern browsers targeting Chrome 92+ / Firefox 95+ / Safari 15.4+, use crypto.randomUUID() — zero dependencies, same security, simpler code. Use the uuid package if you need UUID v7 (time-ordered), v5 (deterministic from string), or need to support legacy environments.

Is crypto.randomUUID() available in all browsers?

It is available in Chrome 92+, Firefox 95+, Safari 15.4+, Edge 92+. It is not available in Internet Explorer or older browser versions. For older browser support, use the uuid npm package which polyfills using Math.random() or the cryptographic engine where available.

Can I generate UUID in the browser without any library?

Yes. crypto.randomUUID() works natively in all modern browsers with no import or package needed. If you need to support older browsers, you can fall back to: window.secure random generator to generate 16 random bytes and format them as UUID v4.

Why should I not use Math.random() to generate UUIDs?

Math.random() is not cryptographically secure. It produces predictable values that could be guessed or replicated. For UUIDs used as session tokens, API keys, or any security-sensitive identifier, always use crypto.randomUUID() or uuid.v4() which both read from the OS cryptographic random source.