Changelog

• Added toggle buttons --- create a toggle button by adding role="switch" to an <input type="checkbox">

• Added print annotations that show <abbr> expansions and <a> hrefs. These can be disabled via the new annotations@print:disabled class.

• Added @p modifier to grid attributes (data-cols@p etc.) for print layouts.

• Added new customization variables:

  • --border-width, as well as variants for inline, block, start, end and interactive styles
  • --border-style, with the same variants
  • --border-radius, --interactive-border-radius and --tab-border-radius
  • --shadow
  • --shadow-focus
  • --shadow-active
  • --shadow-disabled
  • --pressed-shadow
  • --pressed-shadow-focus
  • --pressed-shadow-active

• Added new layout utilities:

  • .align-content:center
  • .align-content:end
  • .overflow:clip
  • .background-clip:text
  • .text-stroke

• Added new border utilities:

  • border:none
  • margin:0
  • margin:auto
  • padding:0

  all with block/inline/start/end versions.

• Added inner density classes:

  • .airy-inside
  • .spacious-inside
  • .dense-inside
  • .crowded-inside
  • .packed-inside

• Added variables for customizing chips: --chip-border-width and --chip-border-style

• Added -x and -y variants to all overflow utility classes.

• Added support for selecting color scheme with <meta name="color-scheme">.

  • Deprecated the .-dark-theme and .-no-dark-theme classes.

• Added scrollbar styling based on theme colors.

• Added styles for <progress> and <meter> elements.

• Renamed .big to .<big>.

  • Deprecated the old name.

• Renamed .f-row, .f-col, .f-switch and .--f-switch-threshold to .flex-row, .flex-column, .flex-switch and .--flex-switch-threshold.

  • Deprecated the old name.

• Added Lucide to our documentation as our officially recommended icon set.

• In the .breadcrumbs class:

  • Added support for the <ol> element's type attribute --- when present, the breadcrumbs will be numbered.

  • Added --breadcrumb-page and --breadcrumb-step for controlling the separator used.

• <a> elements with the .<button> masquerade now work with the iconbutton class.

• Buttons now support colorways.

• Added improved styling for <select> and partial colorway support.

• <dl> elements with the .textcolumns class will now avoid breaking inside terms and descriptions, or between a term and its description.

• Fixed: Dialog elements opened via the new popover and popovertarget attributes will now display correctly.

• Made a whole slew of improvements to our documentation.

• Fixed an issue where some color variables were not properly set in dark mode.

• Fixed an issue with scrollbar placement in .sidebar-layout (#68).

• Fixed an issue where our build process generated syntactically invalid CSS, which could break other people's tools (#76).

• Removed the broken ARIA Listbox component.

• Removed various cases of invalid CSS.

• Deprecated the .all:initial class.

• Deprecated the .primary-font class, previously renamed .main-font.

• Deprecated the --rhythm variable in favor of the new lh and rlh units in CSS.

• Un-deprecated the .center class.