Getting started
Quick start
Link pico.css
manually or via CDN for a dependency-free setup, or use NPM or Composer for advanced usage.
There are 4 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 jsDelivr CDN to link pico.css
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@picocss/pico@next/css/pico.min.css"
/>
Install with NPM#
npm install @picocss/pico@next
yarn add @picocss/pico@next
Install with Composer#
composer require picocss/pico
Starter HTML template#
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/pico.min.css">
<title>Hello, world!</title>
</head>
<body>
<main class="container">
<h1>Hello, world!</h1>
</main>
</body>
</html>