Reset

@pikacss/plugin-reset gives you a build-time way to establish a CSS reset baseline without leaving the PikaCSS configuration model.

When to use it

Use the reset plugin when you want one shared baseline for element defaults across a project or design system.

Install

pnpm

pnpm add @pikacss/plugin-reset

npm

npm install @pikacss/plugin-reset

yarn

yarn add @pikacss/plugin-reset

Minimal setup

import { defineEngineConfig } from '@pikacss/core'
import { reset } from '@pikacss/plugin-reset'

export default defineEngineConfig({
	plugins: [reset()],
})

Available presets

import type { ResetStyle } from '@pikacss/plugin-reset'

// All available reset presets:
const presets: ResetStyle[] = [
	'andy-bell', // Andy Bell's modern CSS reset
	'eric-meyer', // Eric Meyer's classic CSS reset
	'modern-normalize', // Modern Normalize (default)
	'normalize', // Normalize.css
	'the-new-css-reset', // The New CSS Reset
]

When a reset helps and when it hurts

Resets are useful when you want to standardize browser defaults early. They are less useful when a project already has a strong, intentional baseline and the reset only creates another layer of surprises.

Do not hide project styling problems behind a reset

A reset should normalize defaults. It should not become the place where unrelated typography, spacing, and component decisions accumulate.

Custom preset example

import { defineEngineConfig } from '@pikacss/core'
import { reset } from '@pikacss/plugin-reset'

export default defineEngineConfig({
	plugins: [reset()],
	// Choose a different reset preset
	reset: 'eric-meyer',
})

Next

• Typography
• Configuration
• Create A Plugin
• Common Problems