Browser support
Iris CSS supports every browser released since early 2023. Newer features degrade without breaking the page.
| Browser | Version |
|---|---|
| Chrome and Edge | 111 and later |
| Firefox | 113 and later |
| Safari, desktop and iOS | 16.2 and later |
| Opera | 97 and later |
| Samsung Internet | 22 and later |
The floor is set by color-mix(), which Iris CSS uses to derive hover,
border and tint colors. The build adds the vendor prefixes these versions need,
and a fallback for browsers without light-dark().
Newer features
Some features need a newer browser. Without it, the page still works and looks right, with a simpler version.
| Feature | Without support |
|---|---|
| Popover API | Popover content shows in place as normal content, and nav links stay in the bar with no menu button |
| Anchor positioning | Popovers stay centered, and the navbar menu opens at a fixed distance from the top |
::details-content | Accordions open without animating and tabs show as an accordion |
| Scroll buttons and markers | The carousel scrolls with a scrollbar, without buttons and dots |
| Customizable select | Selects use the native option list |
field-sizing | Textareas keep a fixed height |
text-box | Badge text centers on the line box instead of the capitals |
| Invoker commands | command buttons do nothing, so open modals from a script |