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 🙏

© 2025 – Pkg Stats / Ryan Hefner

moss-kit

v1.0.0

Published

The smallest amount of CSS to make a great looking site

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

mattjaredmattjared

Keywords

most-kitcssminimalcsshtmlreset

Readme

moss-kit

The smallest amount of CSS to make a great looking site that removes CSS completely. Inspired by the million other CSS frameworks that do the exact same thing. I wanted to make something that was so simple that it would be easy to understand and easy to use. I expect to break some rules alonge the way in order to make a very good looking and explicit looking site, without CSS that would make sites extremely fast. The idea is to also experiment with this in Next.js sites to see if we can cut Core Web Vitals even further if you use this over other frameworks. To dev on this follow the instructions below. I really wanted to also have a published NPM package and learn how to make that work so here we are. Moss was born. Hope you enjoy, contribute with questions and ideas or code and have fun with it.

Inspiration and Alternatives to use before you start

This is not a replacement for any of these frameworks, it is a replacement of CSS completely. We break some rules to remove CSS completely.

Adding Moss to your project

npm install moss-kit

Adding the CSS to your project is as simple as adding the following to your index.html file.

<link rel="stylesheet" href="https://unpkg.com/moss-kit@latest/dist/moss.css" />

To modify this add any stylesheeting below the moss.css file.

Developing Moss

To develop on this project you can run the following commands.

npm install 
npm run dev

Design Decisions

There are no classes or decisions to make, write your application and the application will be styles.

Breaking the Rules

Grids, columns and row. Where do you even start? I wanted to make it so you could have a great looking performant site and not even think so I decided to break some rules. Leaning on native HTML elements such aside, section, article and main to recreate the concept of a grid system.

  • main is going to be the main content of the page and contains what would traditionally be a .container class. In moss we're gonna make that our wrapper.
  • section is going to be the column of our pages.
  • aside is going to be the row of our pages with a grid class with a preset gutter / spacer
  • article is going to be the row of our pages with a grid class with a preset gutter / spacer
  • header is going to be prestyles to match the navigation bar of 99% of sites we see
  • footer is going to be the footer but an options for us

AI Sidekicks

I'm using Cursor for most of this as my editor but I'm going to handroll all the code for the packge. I'm leaning on Cursor here and there but it's missing the mark on design and breaking the rules where I want to.

I'm also using Claude to help with naming and giving me an entire list of HTML elements to mess with.

I copied the simple.css list of HTML elements and fed that to Claude.

The moss.css logo was made by Dall-E 3.

I am a human right now writing this. Maybe this gets good and is useful enough to be used in AI projects to build good looking sites w/o CSS or utilities classes, maybe it doesn't.

You probably want to use v0 to build your site with Tailwind and ShadCN but maybe Moss is an option for you if you want to cut the CSS completely. Idk. Have fun and lets build somethign and learn together.

License

MIT