---
title: "Options"
description: "Reference of every option accepted by presetVinicunca, with types and the defaults from v2.4.0."
canonical_url: "https://vinicunca.dev/unocss-preset/getting-started/options"
---
# Options

> Reference of every option accepted by presetVinicunca, with types and the defaults from v2.4.0.

Pass a single object to `presetVinicunca()`. Nested presets and transformers accept `true` to enable, `false` to disable, or an options object.

```ts [uno.config.ts]
import { presetVinicunca } from '@vinicunca/unocss-preset';
import { defineConfig } from 'unocss';

export default defineConfig({
  presets: [
    presetVinicunca({
      icons: { scale: 1.2 },
      scrollbar: true,
      alias: true
    })
  ]
});
```

There is no `presets` option on `presetVinicunca`. Nested presets are always composed internally.

## Core

**preflights** (`boolean`): Defaults to true. Injects the CSS reset on the preflights layer. Set false to skip it. Wind4's reset stays off unless you pass wind4: true (boolean), which uses Wind4 defaults including its reset.

**unColor** (`boolean | string`): Defaults to false. When true, a postprocessor rewrites rgb(...) / rgba(...) color values so the channels live on --un-color and the declaration uses rgb(var(--un-color) / <alpha>) (or rgba(var(--un-color) , <alpha>)). Pass a string to use that CSS variable name instead.

**extendedTheme** (`VinicuncaExtends`): Defaults to {}. Only keyframes and string-form animation; other theme tokens belong on the UnoCSS theme option. See Theme.

## Nested presets

**wind4** (`boolean | PresetWind4Options`): Defaults to { preflights: { reset: false } }. Enables presetWind4. false turns it off. true enables Wind4 with its own defaults (including its reset).

**icons** (`boolean | IconsOptions`): Defaults to true. Enables presetIcons. Pass an object for collections, extra properties, and scale.

**webFonts** (`boolean | WebFontsOptions`): Defaults to false. Enables presetWebFonts. This preset does not set a provider; UnoCSS's own default applies.

**typography** (`boolean | TypographyOptions`): Defaults to false. Enables presetTypography.

**scrollbar** (`boolean | UnoPresetScrollbarOption`): Defaults to false. Enables the scrollbar preset. Nested defaults are documented there (noCompatible: true, varPrefix: '', …).

**magicCss** (`boolean`): Defaults to false. Enables the Magic CSS animation preset. There is no extra options object.

**animation** (`boolean | AnimationOptions`): Defaults to true. Enables enter/exit animations. When you pass an object, unit defaults to 'ms'. See nested fields below.

**fluid** (`boolean | DeepPartial<FluidOptions>`): Defaults to true. Enables fluid sizing. Nested defaults: prefix: 'fluid-', minContainerWidth: 320, maxContainerWidth: 1920, defaultBaseUnit: 'px'.

### AnimationOptions

Used when `animation` is an object. These become the default CSS for `animate-in` / `animate-out`. Duration is **not** read from `theme.duration.DEFAULT`.

**unit** (`'ms' | 's'`): Defaults to 'ms'. Unit for duration and delay.

**duration** (`number`): No default. When omitted, animate-in / animate-out hardcode animation-duration: 150ms. When set, the value is concatenated with unit.

**delay** (`number`): No default. Default animation-delay.

**direction** (`'alternate' | 'alternate-reverse' | 'normal' | 'reverse'`): No default. Default animation-direction.

**fillMode** (`'backwards' | 'both' | 'forwards' | 'none'`): No default. Default animation-fill-mode.

**iterationCount** (`'infinite' | number`): No default. Default animation-iteration-count.

**playState** (`'paused' | 'running'`): No default. Default animation-play-state.

**timingFunction** (`'ease' | 'ease-in' | 'ease-in-out' | 'ease-out' | 'linear' | string`): No default. Default animation-timing-function.

### FluidOptions

Used when `fluid` is an object. See [Fluid](https://vinicunca.dev/unocss-preset/fluid) for utilities.

**minContainerWidth** (`number`): Defaults to 320. Viewport width (in the base unit count) where scaling starts.

**maxContainerWidth** (`number`): Defaults to 1920. Viewport width where scaling stops.

**defaultBaseUnit** (`'px' | 'rem' | 'em' | 'vw' | 'vh' | 'vmin' | 'vmax' | 'fr' | 'percent'`): Defaults to 'px'. Unit multiplied into min/max sizes. 'percent' emits %.

**prefix** (`string`): Defaults to 'fluid-'. Prefix for utilities and custom properties. The fluid README still shows f-; that is not the default.

**expandCSSVariables** (`boolean`): Defaults to false. When true, the clamp is split into intermediate custom properties (range-width, factor, range-size, fluid, size).

**disableTheme** (`boolean`): Defaults to false. Disables named theme shortcuts (fluid-p-lg, fluid-text-sm, …).

**themeShortcuts** (`boolean`): Defaults to true. Set false to keep numeric utilities but skip named shortcuts.

**attributify** (`boolean`): Defaults to false. Adds extra shortcuts such as pt-fluid-32/64 for attributify-style names.

**commentHelpers** (`boolean`): Defaults to false. Accepted by the type; the current preset does not emit CSS comments.

**utilities** (`Array<[string, string[]]>`): Defaults to []. Extra [name, cssProperties] pairs merged ahead of the built-in list. A name that matches a built-in replaces it.

### UnoPresetScrollbarOption

Used when `scrollbar` is an object. See [Scrollbar](https://vinicunca.dev/unocss-preset/scrollbar).

**scrollbarWidth** (`string`): Defaults to '8px'.

**scrollbarHeight** (`string`): Defaults to '8px'.

**scrollbarTrackRadius** (`string`): Defaults to '4px'.

**scrollbarThumbRadius** (`string`): Defaults to '4px'.

**scrollbarTrackColor** (`string`): Defaults to '#f5f5f5'.

**scrollbarThumbColor** (`string`): Defaults to '#ddd'.

**prefix** (`string | string[]`): Defaults to ''. Applied to utilities and shortcuts.

**varPrefix** (`string`): Defaults to ''. CSS variables are --scrollbar-* (not --un-scrollbar-*) unless you set a prefix.

**numberToUnit** (`(value: number) => string`): Defaults to a function that divides by 4 and appends rem (scrollbar-w-4 → 1rem). Used when a size class ends in a unitless number.

**noCompatible** (`boolean`): Defaults to true. Skip Firefox scrollbar-color / scrollbar-width (except scrollbar-width: none). Set false to emit those properties; rounded corners and scrollbar-w / scrollbar-h then have no effect in Firefox because scrollbar-color disables ::-webkit-scrollbar styling.

## Transformers

**directives** (`boolean | TransformerDirectivesOptions`): Defaults to true. transformerDirectives.

**variantGroup** (`boolean | TransformerVariantGroupOptions`): Defaults to true. transformerVariantGroup.

**alias** (`boolean | TransformerAliasOptions`): Defaults to off (undefined). Opt-in transformer that expands shortcut aliases in source. See below.

### TransformerAliasOptions

Enable with `alias: true` or an options object. The transformer looks up names in your UnoCSS `shortcuts` and replaces prefixed tokens in source.

```ts [uno.config.ts]
export default defineConfig({
  shortcuts: {
    btn: 'px-4 py-2 rounded bg-primary text-inverted'
  },
  presets: [
    presetVinicunca({
      alias: true
    })
  ]
});
```

```html
<div class="*btn"></div>
<!-- becomes: px-4 py-2 rounded bg-primary text-inverted -->

<div class="+btn"></div>
<!-- becomes: btn px-4 py-2 rounded bg-primary text-inverted
     and `btn` is added to the UnoCSS blocklist when keep.block is true -->
```

**prefix** (`string`): Defaults to '*'. Prefix that replaces the alias with the expanded shortcut.

**keep** (`string | KeepOption`): Defaults to '+'. Prefix that keeps the original class and appends the expansion. A string is treated as { prefix, block: true }.

`KeepOption`:

**prefix** (`string`): Defaults to '+'. Keep prefix.

**block** (`boolean`): Defaults to true. When true, the original alias name is added to uno.config.blocklist so it is not generated as its own utility.


## Sitemap

See the full [sitemap](https://vinicunca.dev/sitemap.md) for all pages.