A lush, classless, and fully semantic CSS framework. An evolution of sakura with a focus on modern semantics and fluid design.
Blossom.css is a drop-in styling solution that transforms plain, raw HTML into a beautiful, readable document with zero classes. It is designed for developers who want to focus on content and semantics rather than fighting with CSS frameworks.
blossom builds upon the minimalist philosophy of sakura but adds modern refinements for a more "lush" reading experience:
- Ultra Lightweight: Under 3KB . It loads almost instantly, ensuring your site is lightning-fast even on slow connections.
- Fluid Typography: Uses CSS
clamp()to scale text smoothly between devices—no more rigid breakpoints. - Lush Vertical Rhythm: Optimized line-height (1.75) and generous spacing to give your content room to breathe.
- Fully Semantic: Custom, classless styling for modern tags like
<nav>,<details>,<aside>,<progress>, and<mark>. - Automatic Dark Mode: Built-in support for
prefers-color-schemeusing high-contrast CSS variables. - Classless Philosophy: Just drop the CSS file in and your standard HTML tags look great immediately.
CDN (recommended):
-
Simply add this in your
<head>tag:<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/Kaiserrrrrr/blossom/dist/blossom.min.css" type="text/css">
Manually:
-
Download the file:
wget "https://cdn.jsdelivr.net/gh/Kaiserrrrrr/blossom/dist/blossom.min.css"OR download directly: blossom
-
Link it from HTML:
<link rel="stylesheet" href="blossom.min.css" type="text/css">
 IE / Edge |
 Firefox |
 Chrome |
 Safari |
 iOS Safari |
 Samsung |
 Opera |
|---|---|---|---|---|---|---|
| IE11, Edge | last 68 versions | last 65 versions | last 6 versions | last 6 versions | last 16 versions | last 60 versions |
© Blossom 2026. Code released under the MIT license.