Authoring

Creating custom presets

Compose built-in or custom Zeenat effects into a typed, reusable website decoration preset.

Compose effects; do not copy them

A preset gives reusable effects a shared occasion, season or campaign meaning. IDs must use lowercase kebab case and the preset must contain at least one valid effect.

company-anniversary.ts
import { definePreset } from "zeenat/core";
import { bunting, sparkles } from "zeenat/effects";

export const companyAnniversary = definePreset({
  id: "company-anniversary",
  name: "Company anniversary",
  description: "Brand-colored bunting with restrained gold accents.",
  tags: ["company", "anniversary"],
  effects: [
    sparkles({ colors: ["#d6a84b", "#ffffff"], count: 12 }),
    bunting({ colors: ["#173f5f", "#ffffff"] }),
  ],
});

Preset metadata

description and tags make presets easier to understand. region, occasion, season and author are optional. Cultural metadata should be specific only when accurate and useful; dates belong in the caller's scheduling options.

Validate contributed presets

The library repository exposes validatePresetDefinition, validatePresetCollection and a preset validation script. Validation checks IDs, metadata, effects, repeated effect IDs and duplicate preset IDs.