Miss any of our Open RFC calls?Watch the recordings here! »

@picocss/pico

1.0.6 • Public • Published

Pico.css

Graceful & Minimal CSS design system in pure semantic HTML.
Elegant styles for all natives HTML elements without .classes and dark mode automatically enabled.

Examples · Documentation

Pico.css

CSS Gzipped Github release npm version License

  • Class-light and semantic: we use simple native HTML tags as much as possible. Only 6 .classes are used in Pico.
  • Great styles with just one CSS file: No dependencies, package manager, external files or JavaScript.
  • Responsive everything: Elegant and consistent adaptatives spacings and typography on all devices.
  • Light or Dark mode: Shipped with two beautiful color themes, automatically enabled according to the user preference.

Usage

There are 3 ways to get started with pico.css:

Install manually

Download Pico and link /css/pico.min.css in the <head> of your website.

<link rel="stylesheet" href="css/pico.min.css">

Install from CDN

Alternatively, you can use the unpkg CDN to link pico.css.

<link rel="stylesheet" href="https://unpkg.com/@picocss/pico@latest/css/pico.min.css">

Install with NPM

npm install @picocss/pico

Examples

  • Class-less: Just a pure semantic HTML markup, without .classes
  • Company: A classic company or blog layout with a sidebar.
  • Google Amp: A simple layout for Google Amp, with inlined CSS.
  • Sign in: A minimalist layout for Login pages.

Documentation

Getting started

Layout

Elements

Components

Copyright and license

Openly inspired by:

Install

npm i @picocss/pico

DownloadsWeekly Downloads

139

Version

1.0.6

License

MIT

Unpacked Size

385 kB

Total Files

66

Homepage

picocss.com

Last publish

Collaborators

  • avatar