Create Your Badge
Enter your npm package name and customize your badge
Badge Styles
Choose the style that best fits your project
Compact Badges
Perfect for GitHub READMEs - shields.io inspired, minimal height, maximum information
Detailed Badges
Classic NodeICO badges with comprehensive package information
Quick Start
Add your badge to any README or documentation
API Reference
Complete reference for all badge parameters and options
Badge Styles
Choose your badge style with the style parameter:
| Style | Description | Data Support |
|---|---|---|
standard |
Classic NodeICO badge (default) | stars, downloads |
compact |
Single-line condensed format | none |
mini |
Minimal install command only | none |
shields |
GitHub README compatible | all data types |
flat |
Modern flat design | all data types |
flat-square |
Flat design with square corners | all data types |
Data Parameters
Add package information with the data parameter. Order matters - data appears in the order specified:
| Parameter | Alias | Description | Example Output |
|---|---|---|---|
name |
n |
Package name | express |
version |
v |
Latest version | v4.18.2 |
downloads |
d |
Weekly downloads | 23M dl/w |
stars |
s |
GitHub stars | 63k★ |
updated |
u |
Last publish date | 2mo ago |
Color Options
Customize badge colors with the color parameter. Works with all badge styles!
| Color | Value | Example |
|---|---|---|
| Default (npm red) | #cb3837 |
|
| Blue | blue |
|
| Bright Green | brightgreen |
|
| Orange | orange |
Also supports: green, yellowgreen, yellow, red, lightgrey,
or any hex color like #ff6b6b
Usage Examples
Basic Badge
/npm/express.svg
Standard badge with default information
Shields Style with Version
/npm/express.svg?style=shields&data=version
Compact GitHub-compatible badge showing version
Multi-Data Badge
/npm/express.svg?style=shields&data=n,v,d
Shows name, version, and downloads in that order
Reordered Data
/npm/express.svg?style=flat&data=d,v,u
Shows downloads first, then version, then updated date
URL Format
https://nodei.co/npm/.svg?
Scoped packages: Include the full scope in the URL: /npm/@babel/core.svg
Multiple data points: Separate with commas: data=n,v,d
Legacy support: Old parameters like downloads=true still work