pphat.me logoRegistry
New Releasev1.4.0, July 28, 2026

@pphatdev/registry Documentation

A powerful and extremely fast CLI tool to instantly download and manage custom UI components and icons on-demand for Next.js, Nuxt 3, or raw SVG.

$npm install -g @pphatdev/registry
bash — pphat CLI Session
~project$
What's inside

Everything you need to ship faster

A focused toolkit for teams who want a design system without the overhead — icons, components, and a CLI that gets out of your way.

01 · Icons Library

Brand & tech icons, ready to ship

A growing registry of brand and technology SVG icons — React, Vue, GitHub, Ansible and more — fetched on demand via the CLI. No icon font, no sprite, no bloat.

Browse Icon Studio
Coming Soon

Components are being crafted with care.

02 · Components Library

Drop-in components

Buttons, cards, dialogs, inputs and more — copy-paste TSX primitives that inherit your theme tokens automatically. Being crafted with care.

<1s
03 · Performance

One command, instant asset

Run `pphat add-icon <name>` and the SVG lands directly in your project. No download page, no manual copy-paste, no waiting.

04 · Portable

Three output formats

Pass `-f svg`, `-f nextjs`, or `-f nuxtjs` to get the exact format your stack needs. Switch frameworks without touching your icon set.

0kb
05 · Bundle

Zero runtime overhead

Icons are fetched as plain files and placed in your repo. Only what you import reaches your bundle — no registry loaded at runtime.

TS
06 · DX

Config once, reuse everywhere

Run `pphat init` once to create a pphatdev.json at your project root. Your preferred format and output paths are saved — no flags needed on subsequent runs.

Try it now

Add your first icon in one command.

$pphat add-icon <name>
Read docs

Icon Playground

Customize vector dimensions, rotation angles, colors, and live presets in real-time. Export production-ready TSX, Vue, or raw SVG code directly to your codebase.

@pphatdev/registry
v1.2.0 Playground
Vector Icon PreviewStage: 32×32px
32px Asset
Size: 32pxRotate: 0°
Controls & Code Output
Size:
Rotate:
Color:
icon.tsx
// Loading registry...
$pphat add-icon <name> -f nextjs
FAQ

Everything you need to know.

Quick answers to the questions we hear most. Missing yours? Head to the full FAQ page below.

You don't need to install anything permanently. Run the CLI directly with npx pphat init to create a pphatdev.json config, then npx pphat add-icon <name> to fetch what you need. If you use it often, npm install -g @pphatdev/registry.

Still curious?

Explore the full list of common questions.

See all FAQs