npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

@zero.sc/ui-kernel

v0.0.2

Published

Zero UI as data — design tokens and a code generator for targets that have no DOM (kernels, framebuffers, embedded).

Readme


@zero.sc/ui ships React components and a Tailwind stylesheet. A kernel, a firmware splash or an embedded panel can link neither. Until now such a surface copied the ecosystem's colours by hand, and a copy ages: on 2026-09-02, five of the nine tokens kernel-zero had transcribed differed from the web — #121518 against #12161a, #E6EAEE against #e6edf3, and so on. Nobody changed them on purpose.

This package moves the values, not the components, and gives you a check that fails when the copy stops matching.

Install

npm i -D @zero.sc/ui-kernel

Use

npx zero-ui-kernel print                       # what the tokens are
npx zero-ui-kernel gen --rust src/tokens.rs    # no_std Rust constants
npx zero-ui-kernel gen --json tokens.json      # the raw table
npx zero-ui-kernel check --rust src/tokens.rs  # exit 1 if it drifted

Programmatic:

import { tokens, emitRust } from '@zero.sc/ui-kernel';

tokens.colors.dark.bg;   // { r: 10, g: 12, b: 14 }
tokens.dims.nav;         // 56
emitRust(tokens);        // Rust source, as a string

What it carries

Seventeen colour tokens in both themes (bg surface border text text-muted accent accent-fg nav nav-text nav-border nav-muted success success-fg warn warn-fg danger danger-fg) and the dimensions the shell contract fixes (nav 56, sidebar 240, sidebar-collapsed 64, touch 44, radius 0).

Dimensions are emitted in pixels alongside BASIS_HEIGHT, the viewport height the web values assume. A framebuffer pixel is physical and a CSS pixel is not, so a consumer with a 480-row panel scales against that basis rather than pretending the units are the same.

Commit the generated file

Generate at authoring time, commit the result, and run check in CI. A kernel build that needs Node to produce a constant is a kernel build that fails offline — and the whole point of a token is that it is a compile-time constant.

Source of truth

@zero.sc/ui's styles.css. Change a colour there, run npm run bake, regenerate. Nothing in this package types a hex digit of its own.

Where this sits

License

MIT OR the Zero License v1.0 — see LICENSE.