Modern Accessible CSS Reset – reset.css

Category: CSS & CSS3 , Recommended | November 28, 2024
0 Comment
Demo Download
Author:mayank99
Views Total:444 views
Official Page:Go to website
Last Update:November 28, 2024
License:MIT

Preview:

Modern Accessible CSS Reset – reset.css

Description:

A lightweight, modern, accessible CSS reset heavily based on the :where() CSS pseudo-class function.

Features:

  • Built-in visually hidden styles for screen reader-only text.
  • Accessible focus outlines.
  • Designed for cascade layers.
  • Auto dark mode.
  • Smooth scroll.
  • And more.

How to use it:

Install and import the reset.css.

# NPM
$ npm i @acab/reset.css
@import '@acab/reset.css';
// or in a JS file
import '@acab/reset.css';
// or from a CDN
@import 'https://unpkg.com/@acab/reset.css';
// or in an HTML document.
<link rel="stylesheet" href="package/index.css" />

Changelog:

v0.11.0 (11/28/2024)

  • make form controls inherit letter-spacing, word-spacing, font-feature-settings and font-variation-settings
  • combine <dialog> and [popover] resets; also unset overflow
  • add interpolate-size to root
  • move line-height to <html> and inherit it on <body>
  • combine cursor: not-allowed styles

v0.10.0 (05/15/2024)

  • add resets for popover
  • handle <dialog popover>
  • add user-select: none to .visually-hidden

v0.9.0 (04/13/2024)

  • add resets for dialog element
  • add scrollbar-gutter: stable to root

v0.8.0 (09/27/2023)

  • remove all button styles
  • use redesigned dual focus indicator
  • add scroll-margin to :target
  • set tab-size on root

v0.7.0 (09/03/2023)

  • add text-wrap: balance to main headings
  • add missing max-width for video

See Also:

You Might Be Interested In:

Leave a Reply