Skip to content

Installation

Grab the CSS file, or the source if you want to build your own.

Iris CSS is not published to npm yet. Until then, the CDN and npm options below will not work. Build it from source instead.

Get the Iris CSS file

One .css file holds all of Iris CSS. It is plain CSS, so there is nothing to compile.

Option 1: use a CDN

Recommended. Import it from jsDelivr in your CSS, or link it in the <head> of your page.

CSS @import
@import "https://cdn.jsdelivr.net/npm/iriscss@0.1.0/dist/iris.min.css";
HTML <link />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/iriscss@0.1.0/dist/iris.min.css">

There is no separate right to left build. Iris CSS uses logical properties, so dir="rtl" on the page is all it takes.

Option 2: download the GitHub release

Download iris-0.1.0.zip from the GitHub releases page, copy iris.min.css into your project and link it.

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

Files

FileContents
iris.cssThe full framework, readable
iris.min.cssThe full framework, minified

Get the Iris CSS source

The source is a set of native CSS files, one per element or component. Use it to import only the parts you need or to build your own version.

Option 1: install the npm package

Recommended.

npm
npm install iriscss
yarn
yarn add iriscss
pnpm
pnpm add iriscss

The package ships the built files in dist/ and the source in src/. Import the stylesheet from your bundler:

@import "iriscss";

Option 2: clone the GitHub repository

Clone it with SSH, HTTPS or the GitHub CLI.

SSH
git clone git@github.com:iriscss/iriscss.git
HTTPS
git clone https://github.com/iriscss/iriscss.git
GitHub CLI
gh repo clone iriscss/iriscss

Then build it. You need Node.js 24 and npm. The stylesheets are written to dist/.

cd iriscss
npm install
npm run build

The repository also holds the tests and tooling, so it is larger than the npm package.