# Installation

Source: https://iriscss.com/documentation/1/overview/installation/

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

## Get the Iris CSS file

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

### Use a CDN

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

**CSS `@import`**

```css
@import "https://cdn.jsdelivr.net/npm/iriscss@1/dist/iris.min.css";
```

**HTML `<link />`**

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/iriscss@1/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.

### Host it yourself

Copy `iris.min.css` from the `dist/` folder of the [npm package](#npm) or of [your own build](#clone) into your project and link it.

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

### Files

| File | Contents |
| --- | --- |
| `iris.css` | The full framework, readable |
| `iris.min.css` | The 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**

```shell
npm install iriscss
```

**yarn**

```shell
yarn add iriscss
```

**pnpm**

```shell
pnpm add iriscss
```

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

```css
@import "iriscss";
```

### Option 2: clone the GitHub repository

Clone it with SSH, HTTPS or the GitHub CLI.

**SSH**

```shell
git clone git@github.com:alopia/iriscss.git
```

**HTTPS**

```shell
git clone https://github.com/alopia/iriscss.git
```

**GitHub CLI**

```shell
gh repo clone alopia/iriscss
```

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

```shell
cd iriscss
npm install
npm run build
```

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