Semantic Version Comparator
Compare, sort, increment, and range-test SemVer version numbers with visual diff highlighting.
Last reviewed: June 2026New to this tool? Click here for instructions
How to Use the SemVer Comparator
To use the Semantic Version Comparator, follow these steps:
1. Enter two version strings in the 'Version A' and 'Version B' fields.
2. Click the 'Compare' button to see the differences between the two versions.
3. To sort a list of versions, paste them into the 'Try Example' field and click 'Sort'.
4. To increment a version, enter the current version and optionally a pre-release tag in the 'Increment' section.
5. To test a version against a range expression, enter the version and range expression in the 'Range' section.
When to Use the Tool in Real Workflows
The Semantic Version Comparator is ideal for developers who need to manage and compare version numbers in their projects. It is particularly useful when working with npm packages, where understanding version compatibility is crucial. The tool helps ensure that updates to dependencies are made safely and predictably.
How It Works
The tool runs entirely in your browser. JavaScript parses each version into major, minor, patch, and pre-release identifiers; compares each field in SemVer precedence order; sorts valid versions locally; generates common increment targets; and evaluates the range forms implemented by the page, including exact versions, comparators, caret ranges, tilde ranges, wildcards, and OR ranges with ||. No version strings are sent to a backend service.
Tips, Edge Cases, or Limitations
1. SemVer precedence compares major, minor, and patch numerically before considering any pre-release identifiers.
2. Pre-release versions such as 1.0.0-alpha sort before the associated normal release 1.0.0. Numeric pre-release identifiers compare numerically; text identifiers compare lexically.
3. Build metadata after + is parsed for display, but SemVer precedence ignores it when deciding whether one version is greater than another.
4. Range support covers common npm-style forms in the UI: exact versions, >, >=, <, <=, caret, tilde, wildcard, space-separated AND, and || OR expressions.
5. Treat range checks as a planning aid. Package managers may add ecosystem-specific behavior around tags, lockfiles, peer dependencies, and registry metadata that this browser-only comparator does not model.
Sources and further reading
For the underlying versioning rules, see the official Semantic Versioning specification. For npm range syntax, see the npm CLI documentation for semver ranges.
Frequently Asked Questions
Quick reference
| Version A | Version B | Comparison Result | Notes |
|---|---|---|---|
| 1.0.0 | 1.0.1 | A < B | Patch update |
| 1.1.0 | 1.0.0 | A > B | Minor update |
| 2.0.0 | 1.9.9 | A > B | Major version change |
| 1.0.0-alpha | 1.0.0 | A < B | Pre-release vs stable |
| 1.2.3 | 1.2.3 | A = B | Exact match |
| 3.4.5 | 3.4.5-rc1 | A > B | Stable vs pre-release |
Example walk-through
Worked example: step-by-step
Step 1. Input two semantic versions (e.g., "1.2.3" and "1.1.5") into the comparator tool.
Step 2. Split each version into major, minor, and patch components using dot notation.
Step 3. Convert each component to integers and compare them sequentially (major → minor → patch).
Step 4. Determine the result: "greater than", "less than", or "equal" based on the first differing component.
Sample input:
version1 = "1.2.3"
version2 = "1.1.5"
Step 5. Output the comparison result using a human-readable message.
Expected output:
"1.2.3 is greater than 1.1.5"
Step 6. Display the result on the webpage with proper formatting and error handling for invalid inputs.