Media Utilities

The css.media utility provides composable media query helpers.
Accepts either number (auto-suffixed with px) or string values.

🧩 Usage

import { css } from '@plumeria/core';
 
const styles = css({
  [css.media.maxWidth(800)]: {
    fontSize: '90%',
  },
  [css.media.range('width <= 1024px')]: {
    display: 'none',
  },
});

📘 API

maxWidth(value: number | string): string

Creates a @media (max-width: …) query.

minWidth(value: number | string): string

range(query: string): string

Creates custom range expressions.

🔗 Related