Fully compatible and actively maintained successor to Pico CSS.
Includes Float labels, Breakout layout and other modern helpers. Simply switch pico.css to blades.css, or use blades.standalone.css with other frameworks.
There are 4 ways to get started:
Download Blades and link css/blades.css in the <head> of your website.
<link rel="stylesheet" href="css/blades.css" />Alternatively, you can use jsDelivr CDN:
<link rel="stylesheet" href="
https://cdn.jsdelivr.net/npm/@anyblades/blades@2/css/blades.min.css
"/>npm install @anyblades/pico # or other CSS framework
npm install @anyblades/bladesThen, import [Pico] and Blades into your CSS:
@import "@anyblades/pico"; /* or other CSS framework */
@import "@anyblades/blades";Live example using Tailwind: https://github.com/anyblades/buildawesome-starters/blob/main/site-tailwind/styles.css
- https://subtle.blades.ninja/ 11ty micro-starter
- https://github.com/anyblades/buildawesome-starters 11ty Tailwind CLI starter(s)
- https://github.com/getgrav/grav-theme-quark2 for Grav CMS v2
- https://jekyll.blades.ninja/ starter
https://blades.ninja/css/standalone/
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="color-scheme" content="light dark" />
<link rel="stylesheet" href="css/blades.css" />
<title>Hello world!</title>
</head>
<body>
<main class="container">
<h1>Hello world!</h1>
</main>
</body>
</html>
NEW- https://github.com/pallets/website 🐍
- https://github.com/getgrav/grav-theme-quark2 🛸
- https://www.11ty.dev/docs/starter/#:~:text=blades
- https://sveltiacms.app/en/docs/start#starter-templates:~:text=anyblades
- https://github.com/johnheenan/minform#css-and-performance
- https://github.com/hostfurl/minformhf