https://github.com/ZaneL1u/unocss-preset-better-breakpoints

UnoCSS has better breakpoint presets, which can be configured for Desktop First and Mobile First
https://github.com/ZaneL1u/unocss-preset-better-breakpoints

Last synced: about 2 months ago
JSON representation

UnoCSS has better breakpoint presets, which can be configured for Desktop First and Mobile First

• Host: GitHub
• URL: https://github.com/ZaneL1u/unocss-preset-better-breakpoints
• Owner: ZaneL1u
• License: mit
• Created: 2025-03-01T08:40:08.000Z (2 months ago)
• Default Branch: main
• Last Pushed: 2025-03-02T10:29:40.000Z (2 months ago)
• Last Synced: 2025-03-09T01:29:37.409Z (2 months ago)
• Language: TypeScript
• Size: 271 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-unocss - unocss-preset-better-breakpoints - preset-better-breakpoints) - Better breakpoints presets for UnoCSS. By [@ZaneL1u](https://github.com/ZaneL1u). (Community / Presets)

README

        
# unocss-preset-better-breakpoints

[![npm version](https://img.shields.io/npm/v/unocss-preset-better-breakpoints?color=yellow)](https://npmjs.com/package/unocss-preset-better-breakpoints)

[![npm downloads](https://img.shields.io/npm/dm/unocss-preset-better-breakpoints?color=yellow)](https://npm.chart.dev/unocss-preset-better-breakpoints)

[![bundle size](https://img.shields.io/bundlephobia/minzip/unocss-preset-better-breakpoints?color=yellow)](https://bundlephobia.com/package/unocss-preset-better-breakpoints)

[![install size](https://badgen.net/packagephobia/install/unocss-preset-better-breakpoints?color=yellow)](https://packagephobia.com/result?p=unocss-preset-better-breakpoints)

[![codecov](https://img.shields.io/codecov/c/gh/ZaneL1u/unocss-preset-better-breakpoints?color=yellow)](https://codecov.io/gh/ZaneL1u/unocss-preset-better-breakpoints)

[![license](https://img.shields.io/github/license/ZaneL1u/unocss-preset-better-breakpoints?color=yellow)](https://github.com/ZaneL1u/unocss-preset-better-breakpoints/blob/main/LICENSE)

UnoCSS has better breakpoint presets, which can be configured for Desktop First and Mobile First.






English | 简体中文



## Features

- 📏 Viewport breakpoints

- 📱 According to the equipment and design

- 📦 Easy to use

- 🚀 Fast and efficient

## Installation

```sh

# ✨ Auto-detect

npx nypm install -D unocss-preset-better-breakpoints

# npm

npm install -D unocss-preset-better-breakpoints

# yarn

yarn add -D unocss-preset-better-breakpoints

# pnpm

pnpm install -D unocss-preset-better-breakpoints

# bun

bun install -D unocss-preset-better-breakpoints

# deno

deno install --dev unocss-preset-better-breakpoints

```

## Usage

```ts [example.ts]

import { defineConfig } from 'unocss'

import { presetBetterBreakpoints } from 'unocss-preset-better-breakpoints'

export default defineConfig({

  presets: [

    // ...

    presetBetterBreakpoints(),

  ],

})

```

## License

Published under the [MIT](https://github.com/ZaneL1u/unocss-preset-better-breakpoints/blob/main/LICENSE) license.

Made by [@ZaneL1u](https://github.com/ZaneL1u) and [community](https://github.com/ZaneL1u/unocss-preset-better-breakpoints/graphs/contributors) 💛











---

_🤖 auto updated with [automd](https://automd.unjs.io)_