{ "_about": "Generated by scripts/gen-native-vocab.mjs from public/dssl. Do not edit by hand. Array order is the engine's insertion order.", "version": "0.16.3", "stateWords": [ "hover", "focus", "focus-visible", "active", "disabled", "checked", "empty", "target", "required", "invalid", "valid", "open", "closed", "placeholder-shown", "read-only", "read-write", "enabled", "indeterminate", "first-child", "last-child", "only-child", "first-of-type", "last-of-type", "link", "visited", "seen" ], "pseudoElements": [ "before", "after", "placeholder", "selection", "marker", "first-line", "first-letter", "backdrop", "file-selector-button", "part", "slotted" ], "vendorPseudoSource": "^-(webkit|moz|ms)-", "cssKeywords": [ "inherit", "initial", "unset", "revert", "revert-layer", "none", "auto", "currentcolor", "transparent", "from", "stroke", "markers", "normal", "black", "silver", "gray", "white", "maroon", "red", "purple", "fuchsia", "green", "lime", "olive", "yellow", "navy", "blue", "teal", "aqua", "orange", "gold", "pink", "brown", "violet", "cyan", "magenta", "indigo", "crimson", "coral", "tomato", "goldenrod", "khaki", "slategray", "slategrey", "dimgray", "dimgrey", "lightgray", "lightgrey", "darkgray", "darkgrey", "gainsboro", "whitesmoke", "ghostwhite", "ivory", "beige", "linen", "seashell", "snow", "honeydew", "mintcream", "azure", "aliceblue", "lavender", "canvas", "canvastext", "linktext", "visitedtext", "activetext", "buttonface", "buttontext", "buttonborder", "field", "fieldtext", "highlight", "highlighttext", "solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "hidden", "visible", "block", "inline", "inline-block", "flex", "inline-flex", "grid", "inline-grid", "flow-root", "contents", "table", "table-row", "table-cell", "list-item", "relative", "absolute", "fixed", "sticky", "static", "start", "end", "center", "left", "right", "between", "around", "evenly", "baseline", "stretch", "space-between", "space-around", "space-evenly", "wrap", "nowrap", "reverse", "row", "column", "row-reverse", "column-reverse", "bold", "bolder", "lighter", "italic", "oblique", "small-caps", "uppercase", "lowercase", "capitalize", "underline", "overline", "line-through", "blink", "ellipsis", "clip", "break-word", "anywhere", "pre", "pre-wrap", "pre-line", "subpixel-antialiased", "antialiased", "pointer", "progress", "default", "move", "text", "wait", "help", "grab", "grabbing", "not-allowed", "zoom-in", "zoom-out", "copy", "alias", "crosshair", "serif", "sans-serif", "monospace", "cursive", "fantasy", "system-ui", "ui-sans-serif", "ui-monospace", "ui-serif", "ui-rounded", "-apple-system", "Roboto", "Helvetica", "Arial", "Menlo", "Consolas", "SFMono-Regular", "Liberation-Mono", "Inter", "Noto-Sans", "Ubuntu", "Cantarell", "Oxygen", "Fira-Sans", "Droid-Sans", "border-box", "content-box", "padding-box", "fill-box", "stroke-box", "view-box", "no-repeat", "repeat-x", "repeat-y", "space", "round", "scroll", "local", "contain", "cover", "fill", "fit-content", "min-content", "max-content", "minmax", "repeat", "clamp", "calc", "var", "url", "env", "attr", "auto-fill", "auto-fit", "subgrid", "dense", "span", "scaleX", "scaleY", "translateX", "translateY", "translate", "rotate", "skew", "skewX", "skewY", "matrix", "ease", "ease-in", "ease-out", "ease-in-out", "linear", "step-start", "step-end", "steps", "cubic-bezier", "spring", "bounce", "smooth", "snap", "forwards", "backwards", "both", "infinite", "alternate", "alternate-reverse", "running", "paused", "safe", "unsafe", "legacy", "loose", "strict", "spell-out", "letters", "isolate", "isolation", "blend", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity", "plus-lighter", "blur", "brightness", "contrast", "grayscale", "invert", "opacity", "sepia", "saturate", "drop-shadow", "pointer coarse fine hover interactive", "first", "last", "odd", "even", "all", "portrait", "landscape", "print", "and", "not", "only", "inline-size", "size", "scroll-state", "snapped", "physical", "logical", "in", "oklab", "oklch", "srgb", "srgb-linear", "display-p3", "a98-rgb", "prophoto-rgb", "rec2020", "xyz", "xyz-d50", "xyz-d65", "shorter", "longer", "deg", "grad", "rad", "turn", "to", "top", "bottom", "above", "below", "closest-side", "farthest-side", "ellipse", "circle", "at", "plaintext", "sideways", "upright", "mixed", "ltr", "rtl", "transform", "-webkit-box", "-webkit-inline-box", "thin", "thick", "medium", "separate", "collapse", "vertical", "horizontal", "balance", "pretty", "orphans", "manual", "pixelated", "crisp-edges", "optimizeSpeed", "optimizeLegibility", "geometricPrecision", "flex-start", "flex-end", "self-start", "self-end", "snap-block", "snap-inline", "swap", "fallback", "optional", "-apple-pay-button", "-infinity", "-moz-mac-unified-toolbar", "-moz-win-borderless-glass", "-moz-win-browsertabbar-toolbox", "-moz-win-communications-toolbox", "-moz-win-communicationstext", "-moz-win-exclude-glass", "-moz-win-glass", "-moz-win-media-toolbox", "-moz-win-mediatext", "-moz-window-button-box", "-moz-window-button-box-maximized", "-moz-window-button-close", "-moz-window-button-maximize", "-moz-window-button-minimize", "-moz-window-button-restore", "-moz-window-frame-bottom", "-moz-window-frame-left", "-moz-window-frame-right", "-moz-window-titlebar", "-moz-window-titlebar-maximized", "-ms-autohiding-scrollbar", "-n", "-n-", "accumulate", "active", "add", "after", "all-petite-caps", "all-scroll", "all-small-caps", "allow-discrete", "allow-end", "allow-keywords", "alpha", "alphabetic", "always", "anchor-center", "anchors-valid", "anchors-visible", "angle", "annotation", "antiquewhite", "any", "aquamarine", "arcs", "auto-add", "auto-flow", "auto-phrase", "avoid", "avoid-column", "avoid-page", "avoid-region", "bar", "before", "bevel", "bidi-override", "bisque", "blanchedalmond", "blank", "block-axis", "block-end", "block-start", "blueviolet", "border", "border-area", "both-edges", "bottom-center", "bottom-left", "bottom-left-corner", "bottom-right", "bottom-right-corner", "box-decoration", "break-all", "break-spaces", "bt", "burlywood", "butt", "button", "button-arrow-down", "button-arrow-next", "button-arrow-previous", "button-arrow-up", "button-bevel", "button-focus", "cadetblue", "cap", "cap-height", "caption", "caret", "cell", "central", "ch-width", "chained", "character-variant", "chartreuse", "checkbox", "checkbox-container", "checkbox-label", "checkmenuitem", "chocolate", "clear", "clone", "close-quote", "closest-corner", "cm", "col-resize", "common-ligatures", "compact", "condensed", "consistent", "constrained", "content", "content-block-size", "content-height", "content-inline-size", "content-width", "context-fill", "context-menu", "context-stroke", "contextual", "cornflowerblue", "cornsilk", "cyclic", "dark", "darkblue", "darkcyan", "darkgoldenrod", "darkgreen", "darkkhaki", "darkmagenta", "darkolivegreen", "darkorange", "darkorchid", "darkred", "darksalmon", "darkseagreen", "darkslateblue", "darkslategray", "darkslategrey", "darkturquoise", "darkviolet", "decreasing", "deeppink", "deepskyblue", "default-button", "definite-first", "destination-atop", "destination-in", "destination-out", "destination-over", "diagonal-fractions", "digits", "disabled", "discretionary-ligatures", "display-p3-linear", "dodgerblue", "dot", "double-circle", "down", "drag", "dualbutton", "e-resize", "each-line", "economy", "edges", "element", "em", "embed", "emoji", "enabled", "entry", "entry-crossing", "evenodd", "ew-resize", "ex", "ex-height", "exact", "exclude", "exit", "exit-crossing", "expanded", "extra-condensed", "extra-expanded", "false", "fangsong", "farthest-corner", "fill-opacity", "filled", "firebrick", "first-letter", "fixed-position", "flat", "flex-flow", "flex-visual", "flip", "flip-block", "flip-inline", "flip-start", "floralwhite", "flow", "force-end", "forestgreen", "frequency", "from-font", "from-image", "full-size-kana", "full-width", "grammar-error", "greenyellow", "grey", "grid-columns", "grid-order", "grid-rows", "grippers", "groupbox", "grow", "hanging", "height", "hide", "historical-forms", "historical-ligatures", "horizontal-tb", "hotpink", "hsl", "hwb", "i", "ic", "ic-height", "ic-width", "icon", "ideograph-alpha", "ideograph-numeric", "ideograph-parenthesis", "ideograph-space", "ideographic", "ideographic-ink", "ignore", "in-flow", "inactive", "increasing", "indianred", "inert", "infinity", "inline-axis", "inline-end", "inline-list-item", "inline-start", "inline-table", "inner-spin-button", "inside", "integer", "inter-character", "inter-word", "intersect", "isolate-override", "jis04", "jis78", "jis83", "jis90", "jump-both", "jump-end", "jump-none", "jump-start", "justify", "keep-all", "lab", "large", "larger", "lavenderblush", "lawngreen", "layout", "lch", "leading-spaces", "ledger", "left-bottom", "left-middle", "left-top", "legal", "lemonchiffon", "length", "letter", "lh", "light", "lightblue", "lightcoral", "lightcyan", "lightgoldenrodyellow", "lightgreen", "lightpink", "lightsalmon", "lightseagreen", "lightskyblue", "lightslategray", "lightslategrey", "lightsteelblue", "lightyellow", "limegreen", "lining-nums", "listbox", "listitem", "literal-punctuation", "lr", "luminance", "mandatory", "manipulation", "margin-box", "match-element", "match-parent", "match-source", "math", "math-auto", "mathematical", "maximum", "media-controls-background", "media-controls-fullscreen-background", "media-current-time-display", "media-enter-fullscreen-button", "media-exit-fullscreen-button", "media-fullscreen-button", "media-mute-button", "media-overlay-play-button", "media-play-button", "media-seek-back-button", "media-seek-forward-button", "media-slider", "media-sliderthumb", "media-time-remaining-display", "media-toggle-closed-captions-button", "media-volume-slider", "media-volume-slider-container", "media-volume-sliderthumb", "mediumaquamarine", "mediumblue", "mediumorchid", "mediumpurple", "mediumseagreen", "mediumslateblue", "mediumspringgreen", "mediumturquoise", "mediumvioletred", "menu", "menuarrow", "menubar", "menucheckbox", "menuimage", "menuitem", "menuitemtext", "menulist", "menulist-button", "menulist-text", "menulist-textfield", "menupopup", "menuradio", "menuseparator", "message-box", "meter", "meterbar", "meterchunk", "middle", "midnightblue", "mistyrose", "miter", "miter-clip", "mm", "moccasin", "most-block-size", "most-height", "most-inline-size", "most-width", "ms", "multiple", "n-", "n-resize", "navajowhite", "ne-resize", "nearest", "nesw-resize", "never", "next", "no-clip", "no-close-quote", "no-common-ligatures", "no-contextual", "no-discretionary-ligatures", "no-drag", "no-drop", "no-historical-ligatures", "no-limit", "no-open-quote", "no-overflow", "no-punctuation", "non-rotation", "non-scaling-size", "non-scaling-stroke", "nonzero", "notch", "ns-resize", "number", "numeric", "numeric-only", "nw-resize", "nwse-resize", "objects", "off", "oldlace", "oldstyle-nums", "olivedrab", "on", "open", "open-quote", "or", "orangered", "orchid", "ordered", "ordinal", "ornaments", "outside", "over", "pack", "padding", "page", "paint", "painted", "palegoldenrod", "palegreen", "paleturquoise", "palevioletred", "pan-down", "pan-left", "pan-right", "pan-up", "pan-x", "pan-y", "papayawhip", "pause", "pc", "peachpuff", "per-line", "per-line-all", "peru", "petite-caps", "pi", "pinch-zoom", "play", "play-backwards", "play-forwards", "play-once", "plum", "plus-darker", "position", "powderblue", "preserve", "preserve-3d", "preserve-breaks", "preserve-parent-color", "preserve-spaces", "progress-bar", "progress-bar-value", "progressbar", "progressbar-vertical", "progresschunk", "progresschunk-vertical", "proportional-nums", "proportional-width", "proximity", "pt", "push-button", "px", "radio", "radio-container", "radio-label", "radiomenuitem", "railed", "range", "range-thumb", "raw-string", "read-only", "read-write", "read-write-plaintext-only", "rebeccapurple", "recto", "region", "rem", "replace", "replay", "reset", "resizer", "resizerpanel", "right-bottom", "right-middle", "right-top", "rl", "rlh", "root", "rosybrown", "row-resize", "royalblue", "ruby", "ruby-base", "ruby-base-container", "ruby-text", "ruby-text-container", "run-in", "s", "s-resize", "saddlebrown", "salmon", "sandybrown", "scale-down", "scale-horizontal", "scale-vertical", "scalethumb-horizontal", "scalethumb-vertical", "scalethumbend", "scalethumbstart", "scalethumbtick", "scoop", "scroll-position", "scrollbar", "scrollbarbutton-down", "scrollbarbutton-left", "scrollbarbutton-right", "scrollbarbutton-up", "scrollbarthumb-horizontal", "scrollbarthumb-vertical", "scrollbartrack-horizontal", "scrollbartrack-vertical", "se-resize", "seagreen", "searchfield", "searchfield-cancel-button", "searchfield-decoration", "searchfield-results-button", "searchfield-results-decoration", "select", "select-after", "select-all", "select-before", "select-menu", "select-same", "self", "self-block", "self-block-end", "self-block-start", "self-inline", "self-inline-end", "self-inline-start", "semi-condensed", "semi-expanded", "separator", "sesame", "sheet", "show", "shrink", "sides", "sideways-lr", "sideways-rl", "sienna", "simplified", "single", "skyblue", "slashed-zero", "slateblue", "slice", "slider-horizontal", "slider-vertical", "sliderthumb-horizontal", "sliderthumb-vertical", "small", "small-caption", "smaller", "source-atop", "source-in", "source-order", "source-out", "source-over", "space-all", "space-first", "spaces", "span-all", "span-block-end", "span-block-start", "span-bottom", "span-end", "span-inline-end", "span-inline-start", "span-left", "span-right", "span-self-block-end", "span-self-block-start", "span-self-end", "span-self-inline-end", "span-self-inline-start", "span-self-start", "span-start", "span-top", "span-x-end", "span-x-self-end", "span-x-self-start", "span-x-start", "span-y-end", "span-y-self-end", "span-y-self-start", "span-y-start", "spelling-error", "spinner", "spinner-downbutton", "spinner-textfield", "spinner-upbutton", "splitter", "springgreen", "square", "square-button", "squircle", "stable", "stacked-fractions", "standard", "status-bar", "statusbar", "statusbarpanel", "steelblue", "stretch-to-fit", "string", "stroke-opacity", "style", "styleset", "stylistic", "sub", "subtract", "super", "sw-resize", "swash", "symbolic", "tab", "tab-scroll-arrow-back", "tab-scroll-arrow-forward", "table-caption", "table-column", "table-column-group", "table-footer-group", "table-header-group", "table-row-group", "tabpanel", "tabpanels", "tabular-nums", "tan", "tb", "text-after-edge", "text-before-edge", "text-bottom", "text-top", "textarea", "textfield", "textfield-multiline", "thistle", "time", "titling-caps", "to-zero", "toolbar", "toolbarbutton", "toolbarbutton-dropdown", "toolbargripper", "toolbox", "tooltip", "top-center", "top-left", "top-left-corner", "top-right", "top-right-corner", "touch", "traditional", "trailing-spaces", "treeheader", "treeheadercell", "treeheadersortarrow", "treeitem", "treeline", "treetwisty", "treetwistyopen", "treeview", "triangle", "trim-both", "trim-end", "trim-start", "true", "turquoise", "ultra-condensed", "ultra-expanded", "under", "underscore", "unicase", "unicode", "up", "vb", "verso", "vertical-lr", "vertical-rl", "vertical-text", "vertical-to-horizontal", "vh", "vi", "vmax", "vmin", "vw", "w-resize", "wavy", "weight", "wheat", "width", "wrap-reverse", "write-only", "x", "x-end", "x-large", "x-self-end", "x-self-start", "x-small", "x-start", "xor", "xx-large", "xx-small", "xxx-large", "y", "y-end", "y-self-end", "y-self-start", "y-start", "yellowgreen", "z", "zoom" ], "knownProps": [ "all", "appearance", "accent-color", "align-content", "align-items", "align-self", "align-tracks", "aspect-ratio", "backdrop-filter", "backface-visibility", "background", "background-attachment", "background-blend-mode", "background-clip", "background-color", "background-image", "background-origin", "background-position", "background-repeat", "background-size", "block-size", "border", "border-block", "border-block-color", "border-block-end", "border-block-end-color", "border-block-end-style", "border-block-end-width", "border-block-start", "border-block-start-color", "border-block-start-style", "border-block-start-width", "border-block-style", "border-block-width", "border-bottom", "border-bottom-color", "border-bottom-left-radius", "border-bottom-right-radius", "border-bottom-style", "border-bottom-width", "border-collapse", "border-color", "border-end-end-radius", "border-end-start-radius", "border-image", "border-image-outset", "border-image-repeat", "border-image-slice", "border-image-source", "border-image-width", "border-inline", "border-inline-color", "border-inline-end", "border-inline-end-color", "border-inline-end-style", "border-inline-end-width", "border-inline-start", "border-inline-start-color", "border-inline-start-style", "border-inline-start-width", "border-inline-style", "border-inline-width", "border-left", "border-left-color", "border-left-style", "border-left-width", "border-radius", "border-right", "border-right-color", "border-right-style", "border-right-width", "border-spacing", "border-start-end-radius", "border-start-start-radius", "border-style", "border-top", "border-top-color", "border-top-left-radius", "border-top-right-radius", "border-top-style", "border-top-width", "border-width", "bottom", "counter-reset", "counter-increment", "counter-set", "box-decoration-break", "box-shadow", "box-sizing", "break-after", "break-before", "break-inside", "caret-color", "caret-shape", "clear", "clip", "clip-path", "color", "color-scheme", "column-count", "column-fill", "column-gap", "column-rule", "column-rule-color", "column-rule-style", "column-rule-width", "column-span", "column-width", "columns", "contain", "contain-intrinsic-size", "container", "container-name", "container-type", "content", "content-visibility", "cursor", "caret", "display", "empty-cells", "filter", "flex", "flex-basis", "flex-direction", "flex-flow", "flex-grow", "flex-shrink", "flex-wrap", "float", "fill", "fill-rule", "fill-opacity", "stroke", "stroke-dasharray", "stroke-dashoffset", "stroke-linecap", "stroke-linejoin", "stroke-opacity", "stroke-width", "font", "font-family", "font-feature-settings", "font-kerning", "font-language-override", "font-optical-sizing", "font-palette", "font-size", "font-size-adjust", "font-stretch", "font-style", "font-synthesis", "font-variant", "font-variant-caps", "font-variant-east-asian", "font-variant-ligatures", "font-variant-numeric", "font-variant-position", "font-variation-settings", "font-weight", "forced-color-adjust", "gap", "grid", "grid-area", "grid-auto-columns", "grid-auto-flow", "grid-auto-rows", "grid-column", "grid-column-end", "grid-column-gap", "grid-column-start", "grid-gap", "grid-row", "grid-row-end", "grid-row-gap", "grid-row-start", "grid-template", "grid-template-areas", "grid-template-columns", "grid-template-rows", "hanging-punctuation", "height", "hyphenate-character", "hyphenate-limit-chars", "hyphens", "image-orientation", "image-rendering", "inline-size", "inset", "inset-block", "inset-block-end", "inset-block-start", "inset-inline", "inset-inline-end", "inset-inline-start", "isolation", "justify-content", "justify-items", "justify-self", "justify-tracks", "left", "letter-spacing", "line-break", "line-height", "list-style", "list-style-image", "list-style-position", "list-style-type", "margin", "margin-block", "margin-block-end", "margin-block-start", "margin-bottom", "margin-inline", "margin-inline-end", "margin-inline-start", "margin-left", "margin-right", "margin-top", "margin-trim", "mask", "mask-border", "mask-border-mode", "mask-border-outset", "mask-border-repeat", "mask-border-slice", "mask-border-source", "mask-border-width", "mask-clip", "mask-composite", "mask-image", "mask-mode", "mask-origin", "mask-position", "mask-repeat", "mask-size", "max-height", "max-inline-size", "max-width", "min-block-size", "min-height", "min-inline-size", "min-width", "mix-blend-mode", "object-fit", "object-position", "offset", "offset-anchor", "offset-distance", "offset-path", "offset-rotate", "opacity", "order", "outline", "outline-color", "outline-offset", "outline-style", "outline-width", "overflow", "overflow-anchor", "overflow-clip-margin", "overflow-wrap", "overflow-x", "overflow-y", "overscroll-behavior", "overscroll-behavior-block", "overscroll-behavior-inline", "overscroll-behavior-x", "overscroll-behavior-y", "padding", "padding-block", "padding-block-end", "padding-block-start", "padding-bottom", "padding-inline", "padding-inline-end", "padding-inline-start", "padding-left", "padding-right", "padding-top", "page-break-after", "page-break-before", "page-break-inside", "paint-order", "perspective", "perspective-origin", "place-content", "place-items", "place-self", "pointer-events", "position", "print-color-adjust", "quotes", "resize", "right", "rotate", "row-gap", "ruby-align", "ruby-merge", "scale", "scroll-behavior", "scroll-margin", "scroll-margin-block", "scroll-margin-block-end", "scroll-margin-block-start", "scroll-margin-bottom", "scroll-margin-inline", "scroll-margin-inline-end", "scroll-margin-inline-start", "scroll-margin-left", "scroll-margin-right", "scroll-margin-top", "scroll-padding", "scroll-padding-block", "scroll-padding-bottom", "scroll-padding-inline", "scroll-padding-left", "scroll-padding-right", "scroll-padding-top", "scroll-snap-align", "scroll-snap-stop", "scroll-snap-type", "scrollbar-color", "scrollbar-gutter", "scrollbar-width", "shape-image-threshold", "shape-margin", "shape-outside", "tab-size", "table-layout", "text-align", "text-align-last", "text-combine-upright", "text-decoration", "text-decoration-color", "text-decoration-line", "text-decoration-skip-ink", "text-decoration-style", "text-decoration-thickness", "text-emphasis", "text-emphasis-color", "text-emphasis-position", "text-emphasis-style", "text-indent", "text-justify", "text-orientation", "text-overflow", "text-rendering", "text-shadow", "text-transform", "text-underline-offset", "text-underline-position", "text-wrap", "top", "touch-action", "transform", "transform-box", "transform-origin", "transform-style", "transition", "transition-behavior", "transition-delay", "transition-duration", "transition-property", "transition-timing-function", "translate", "unicode-bidi", "user-select", "vertical-align", "visibility", "white-space", "white-space-collapse", "width", "will-change", "word-break", "word-spacing", "word-wrap", "writing-mode", "z-index", "zoom", "animation", "animation-composition", "animation-delay", "animation-direction", "animation-duration", "animation-fill-mode", "animation-iteration-count", "animation-name", "animation-play-state", "animation-range", "animation-timeline", "animation-timing-function", "view-transition-name", "interpolate-size", "text-box", "text-box-edge", "text-box-trim", "dynamic-range-limit", "field-sizing", "anchor-name", "position-anchor", "position-area", "scroll-timeline", "scroll-timeline-axis", "scroll-timeline-name", "timeline-scope", "view-timeline", "view-timeline-axis", "view-timeline-name", "-webkit-background-clip", "-webkit-text-fill-color", "-webkit-box-orient", "-webkit-line-clamp", "-webkit-tap-highlight-color", "-webkit-font-smoothing", "-moz-osx-font-smoothing", "-webkit-box-shadow", "-webkit-text-stroke", "-webkit-user-select", "-webkit-touch-callout", "-webkit-overflow-scrolling", "-webkit-appearance", "-moz-appearance", "-moz-binding", "-moz-border-bottom-colors", "-moz-border-left-colors", "-moz-border-right-colors", "-moz-border-top-colors", "-moz-context-properties", "-moz-float-edge", "-moz-force-broken-image-icon", "-moz-orient", "-moz-outline-radius", "-moz-outline-radius-bottomleft", "-moz-outline-radius-bottomright", "-moz-outline-radius-topleft", "-moz-outline-radius-topright", "-moz-stack-sizing", "-moz-text-blink", "-moz-user-focus", "-moz-user-input", "-moz-user-modify", "-moz-window-dragging", "-moz-window-shadow", "-ms-accelerator", "-ms-block-progression", "-ms-content-zoom-chaining", "-ms-content-zoom-limit", "-ms-content-zoom-limit-max", "-ms-content-zoom-limit-min", "-ms-content-zoom-snap", "-ms-content-zoom-snap-points", "-ms-content-zoom-snap-type", "-ms-content-zooming", "-ms-filter", "-ms-flow-from", "-ms-flow-into", "-ms-grid-columns", "-ms-grid-rows", "-ms-high-contrast-adjust", "-ms-hyphenate-limit-chars", "-ms-hyphenate-limit-lines", "-ms-hyphenate-limit-zone", "-ms-ime-align", "-ms-overflow-style", "-ms-scroll-chaining", "-ms-scroll-limit", "-ms-scroll-limit-x-max", "-ms-scroll-limit-x-min", "-ms-scroll-limit-y-max", "-ms-scroll-limit-y-min", "-ms-scroll-rails", "-ms-scroll-snap-points-x", "-ms-scroll-snap-points-y", "-ms-scroll-snap-type", "-ms-scroll-snap-x", "-ms-scroll-snap-y", "-ms-scroll-translation", "-ms-scrollbar-3dlight-color", "-ms-scrollbar-arrow-color", "-ms-scrollbar-base-color", "-ms-scrollbar-darkshadow-color", "-ms-scrollbar-face-color", "-ms-scrollbar-highlight-color", "-ms-scrollbar-shadow-color", "-ms-scrollbar-track-color", "-ms-text-autospace", "-ms-touch-select", "-ms-user-select", "-ms-wrap-flow", "-ms-wrap-margin", "-ms-wrap-through", "-webkit-border-after", "-webkit-border-after-color", "-webkit-border-after-style", "-webkit-border-after-width", "-webkit-border-before", "-webkit-border-before-color", "-webkit-border-before-style", "-webkit-border-before-width", "-webkit-border-end", "-webkit-border-end-color", "-webkit-border-end-style", "-webkit-border-end-width", "-webkit-border-start", "-webkit-border-start-color", "-webkit-border-start-style", "-webkit-border-start-width", "-webkit-box-reflect", "-webkit-mask", "-webkit-mask-attachment", "-webkit-mask-clip", "-webkit-mask-composite", "-webkit-mask-image", "-webkit-mask-origin", "-webkit-mask-position", "-webkit-mask-position-x", "-webkit-mask-position-y", "-webkit-mask-repeat", "-webkit-mask-repeat-x", "-webkit-mask-repeat-y", "-webkit-mask-size", "-webkit-text-stroke-color", "-webkit-text-stroke-width", "-webkit-user-modify", "alignment-baseline", "anchor-scope", "animation-range-end", "animation-range-start", "animation-trigger", "background-position-x", "background-position-y", "baseline-shift", "baseline-source", "border-shape", "box-align", "box-direction", "box-flex", "box-flex-group", "box-lines", "box-ordinal-group", "box-orient", "box-pack", "caption-side", "caret-animation", "clip-rule", "color-interpolation-filters", "column-height", "column-wrap", "contain-intrinsic-block-size", "contain-intrinsic-height", "contain-intrinsic-inline-size", "contain-intrinsic-width", "corner-block-end-shape", "corner-block-start-shape", "corner-bottom-left-shape", "corner-bottom-right-shape", "corner-bottom-shape", "corner-end-end-shape", "corner-end-start-shape", "corner-inline-end-shape", "corner-inline-start-shape", "corner-left-shape", "corner-right-shape", "corner-shape", "corner-start-end-shape", "corner-start-start-shape", "corner-top-left-shape", "corner-top-right-shape", "corner-top-shape", "cx", "cy", "d", "direction", "dominant-baseline", "flex-line-count", "flood-color", "flood-opacity", "font-smooth", "font-synthesis-position", "font-synthesis-small-caps", "font-synthesis-style", "font-synthesis-weight", "font-variant-alternates", "font-variant-emoji", "font-width", "frame-sizing", "image-resolution", "initial-letter", "initial-letter-align", "interactivity", "interest-delay", "interest-delay-end", "interest-delay-start", "lighting-color", "line-clamp", "line-height-step", "link-parameters", "marker", "marker-end", "marker-mid", "marker-start", "mask-type", "masonry-auto-flow", "math-depth", "math-shift", "math-style", "max-block-size", "max-lines", "object-view-box", "offset-position", "orphans", "overflow-block", "overflow-clip-box", "overflow-inline", "overlay", "page", "path-length", "position-try", "position-try-fallbacks", "position-try-order", "position-visibility", "r", "reading-flow", "reading-order", "ruby-overhang", "ruby-position", "rx", "ry", "scroll-axis-lock", "scroll-initial-target", "scroll-marker-group", "scroll-padding-block-end", "scroll-padding-block-start", "scroll-padding-inline-end", "scroll-padding-inline-start", "scroll-target-group", "shape-rendering", "speak-as", "stop-color", "stop-opacity", "stroke-color", "stroke-miterlimit", "text-anchor", "text-autospace", "text-decoration-inset", "text-decoration-skip", "text-fit", "text-size-adjust", "text-spacing-trim", "text-wrap-mode", "text-wrap-style", "timeline-trigger", "timeline-trigger-activation-range", "timeline-trigger-activation-range-end", "timeline-trigger-activation-range-start", "timeline-trigger-active-range", "timeline-trigger-active-range-end", "timeline-trigger-active-range-start", "timeline-trigger-name", "timeline-trigger-source", "trigger-scope", "vector-effect", "view-timeline-inset", "view-transition-class", "view-transition-scope", "widows", "window-drag", "x", "y" ], "unitlessProps": [ "opacity", "line-height", "z-index", "font-weight", "flex-grow", "flex-shrink", "flex", "order", "scale", "widows", "orphans", "column-count", "aspect-ratio", "animation-iteration-count", "flood-opacity", "fill-opacity", "stop-opacity", "shape-image-threshold", "counter-reset", "counter-increment", "counter-set", "grid-row", "grid-column", "grid-area", "font-feature-settings", "font-variation-settings", "tab-size", "-webkit-line-clamp", "line-clamp", "stroke-miterlimit", "stroke-opacity", "initial-letter", "font-size-adjust" ], "timeProps": [ "transition-delay", "transition-duration", "animation-delay", "animation-duration", "animation" ], "unitlessFns": [ "oklch", "oklab", "lab", "lch", "hsl", "hsla", "rgb", "rgba", "hwb", "color", "color-mix", "light-dark", "brightness", "saturate", "contrast", "grayscale", "sepia", "invert", "opacity", "scale", "scalex", "scaley", "scalez", "scale3d", "steps", "cubic-bezier", "linear", "radial", "conic" ], "lengthFns": [ "calc", "min", "max", "clamp", "round", "mod", "rem", "abs", "sign", "hypot", "pow", "sqrt", "log", "exp", "blur", "drop-shadow" ], "colorWords": [ "black", "silver", "gray", "white", "maroon", "red", "purple", "fuchsia", "green", "lime", "olive", "yellow", "navy", "blue", "teal", "aqua", "orange", "gold", "pink", "brown", "violet", "cyan", "magenta", "indigo", "crimson", "coral", "tomato", "goldenrod", "khaki", "slategray", "slategrey", "dimgray", "dimgrey", "lightgray", "lightgrey", "darkgray", "darkgrey", "gainsboro", "whitesmoke", "ghostwhite", "ivory", "beige", "linen", "seashell", "snow", "honeydew", "mintcream", "azure", "aliceblue", "lavender", "canvas", "canvastext", "linktext", "visitedtext", "activetext", "buttonface", "buttontext", "buttonborder", "field", "fieldtext", "highlight", "highlighttext", "currentcolor", "transparent" ], "fluidProps": [ "font-size", "width", "height", "inline-size", "block-size", "min-width", "max-width", "min-height", "max-height", "gap", "row-gap", "column-gap", "padding", "margin", "inset", "top", "right", "bottom", "left", "padding-top", "padding-right", "padding-bottom", "padding-left", "padding-inline", "padding-block", "margin-top", "margin-right", "margin-bottom", "margin-left", "margin-inline", "margin-block", "letter-spacing", "border-radius" ], "placeWords": { "center": [ "center", "center" ], "start": [ "start", "flex-start" ], "end": [ "end", "flex-end" ], "between": [ "center", "space-between" ], "around": [ "center", "space-around" ], "evenly": [ "center", "space-evenly" ], "stretch": [ "stretch", "flex-start" ], "baseline": [ "baseline", "flex-start" ] }, "easings": { "snap": "cubic-bezier(0.2, 0.9, 0.3, 1)", "smooth": "cubic-bezier(0.4, 0, 0.2, 1)", "bounce": "cubic-bezier(0.34, 1.56, 0.64, 1)", "linear": "linear", "ease": "ease", "ease-in": "ease-in", "ease-out": "ease-out", "ease-in-out": "ease-in-out" }, "defaultTokens": { "color.ink": "#16161d", "color.paper": "#faf7f2", "color.card": "#ffffff", "color.muted": "#6f6a7a", "color.line": "#e5ded2", "color.accent": "oklch(62% 0.19 35)", "color.accent-ink": "#fff6ee", "color.ok": "#2e7d4f", "color.err": "#b3372e", "space.1": "4", "space.2": "8", "space.3": "12", "space.4": "16", "space.5": "24", "space.6": "32", "space.7": "48", "space.8": "64", "radius.sm": "8", "radius.md": "14", "radius.lg": "22", "radius.full": "999", "shadow.sm": "0 1 2 color.ink/8, 0 1 3 color.ink/6", "shadow.md": "0 2 4 color.ink/10, 0 4 12 color.ink/8", "shadow.lg": "0 4 8 color.ink/12, 0 12 32 color.ink/12", "shadow.xl": "0 8 16 color.ink/14, 0 24 64 color.ink/16", "font.sans": "system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif", "font.mono": "ui-monospace, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", monospace" }, "semanticNames": [ "size", "row", "column", "grid", "stack", "place", "center", "cover", "sticky", "font", "fluid", "shadow", "radius", "circle", "align", "z", "grow", "shrink", "basis", "truncate", "visually-hidden", "transition", "animate", "stagger", "overlap", "bend", "bend-y", "bend-up", "fold", "bend-around", "stretch", "gradient", "text-stroke", "yield", "outline-shape", "rotate", "gradient-text", "gradient-flow", "texture", "aura", "aura-glow", "aura-particle", "aura-particles", "glow-particle", "glow-particles", "aura-glow-particle", "aura-glow-particles", "glass", "tilt", "slider" ], "namedColors": { "aliceblue": "#f0f8ff", "antiquewhite": "#faebd7", "aqua": "#00ffff", "aquamarine": "#7fffd4", "azure": "#f0ffff", "beige": "#f5f5dc", "bisque": "#ffe4c4", "black": "#000000", "blanchedalmond": "#ffebcd", "blue": "#0000ff", "blueviolet": "#8a2be2", "brown": "#a52a2a", "burlywood": "#deb887", "cadetblue": "#5f9ea0", "chartreuse": "#7fff00", "chocolate": "#d2691e", "coral": "#ff7f50", "cornflowerblue": "#6495ed", "cornsilk": "#fff8dc", "crimson": "#dc143c", "cyan": "#00ffff", "darkblue": "#00008b", "darkcyan": "#008b8b", "darkgoldenrod": "#b8860b", "darkgray": "#a9a9a9", "darkgreen": "#006400", "darkgrey": "#a9a9a9", "darkkhaki": "#bdb76b", "darkmagenta": "#8b008b", "darkolivegreen": "#556b2f", "darkorange": "#ff8c00", "darkorchid": "#9932cc", "darkred": "#8b0000", "darksalmon": "#e9967a", "darkseagreen": "#8fbc8f", "darkslateblue": "#483d8b", "darkslategray": "#2f4f4f", "darkslategrey": "#2f4f4f", "darkturquoise": "#00ced1", "darkviolet": "#9400d3", "deeppink": "#ff1493", "deepskyblue": "#00bfff", "dimgray": "#696969", "dimgrey": "#696969", "dodgerblue": "#1e90ff", "firebrick": "#b22222", "floralwhite": "#fffaf0", "forestgreen": "#228b22", "fuchsia": "#ff00ff", "gainsboro": "#dcdcdc", "ghostwhite": "#f8f8ff", "gold": "#ffd700", "goldenrod": "#daa520", "gray": "#808080", "green": "#008000", "greenyellow": "#adff2f", "grey": "#808080", "honeydew": "#f0fff0", "hotpink": "#ff69b4", "indianred": "#cd5c5c", "indigo": "#4b0082", "ivory": "#fffff0", "khaki": "#f0e68c", "lavender": "#e6e6fa", "lavenderblush": "#fff0f5", "lawngreen": "#7cfc00", "lemonchiffon": "#fffacd", "lightblue": "#add8e6", "lightcoral": "#f08080", "lightcyan": "#e0ffff", "lightgoldenrodyellow": "#fafad2", "lightgray": "#d3d3d3", "lightgreen": "#90ee90", "lightgrey": "#d3d3d3", "lightpink": "#ffb6c1", "lightsalmon": "#ffa07a", "lightseagreen": "#20b2aa", "lightskyblue": "#87cefa", "lightslategray": "#778899", "lightslategrey": "#778899", "lightsteelblue": "#b0c4de", "lightyellow": "#ffffe0", "lime": "#00ff00", "limegreen": "#32cd32", "linen": "#faf0e6", "magenta": "#ff00ff", "maroon": "#800000", "mediumaquamarine": "#66cdaa", "mediumblue": "#0000cd", "mediumorchid": "#ba55d3", "mediumpurple": "#9370db", "mediumseagreen": "#3cb371", "mediumslateblue": "#7b68ee", "mediumspringgreen": "#00fa9a", "mediumturquoise": "#48d1cc", "mediumvioletred": "#c71585", "midnightblue": "#191970", "mintcream": "#f5fffa", "mistyrose": "#ffe4e1", "moccasin": "#ffe4b5", "navajowhite": "#ffdead", "navy": "#000080", "oldlace": "#fdf5e6", "olive": "#808000", "olivedrab": "#6b8e23", "orange": "#ffa500", "orangered": "#ff4500", "orchid": "#da70d6", "palegoldenrod": "#eee8aa", "palegreen": "#98fb98", "paleturquoise": "#afeeee", "palevioletred": "#db7093", "papayawhip": "#ffefd5", "peachpuff": "#ffdab9", "peru": "#cd853f", "pink": "#ffc0cb", "plum": "#dda0dd", "powderblue": "#b0e0e6", "purple": "#800080", "rebeccapurple": "#663399", "red": "#ff0000", "rosybrown": "#bc8f8f", "royalblue": "#4169e1", "saddlebrown": "#8b4513", "salmon": "#fa8072", "sandybrown": "#f4a460", "seagreen": "#2e8b57", "seashell": "#fff5ee", "sienna": "#a0522d", "silver": "#c0c0c0", "skyblue": "#87ceeb", "slateblue": "#6a5acd", "slategray": "#708090", "slategrey": "#708090", "snow": "#fffafa", "springgreen": "#00ff7f", "steelblue": "#4682b4", "tan": "#d2b48c", "teal": "#008080", "thistle": "#d8bfd8", "tomato": "#ff6347", "turquoise": "#40e0d0", "violet": "#ee82ee", "wheat": "#f5deb3", "white": "#ffffff", "whitesmoke": "#f5f5f5", "yellow": "#ffff00", "yellowgreen": "#9acd32" }, "texture": { "generators": [ "noise", "bump", "lines", "dots", "grid", "checker", "weave", "carbon", "waves", "hex", "rings", "bricks", "herringbone", "plaid", "scales", "chevron", "diamonds", "triangles", "starfield", "terrazzo" ], "blendModes": [ "normal", "multiply", "screen", "overlay", "soft-light", "hard-light", "color-burn", "color-dodge", "darken", "lighten", "difference", "exclusion" ], "keys": { "scale": { "words": 1, "kind": "number", "min": 0.1, "max": 2000, "doc": "feature size in px: how big the grains, cells or lines are" }, "intensity": { "words": 1, "kind": "number", "min": 0, "max": 2, "doc": "how strong the layer is, 0 to 1 (more than 1 over-drives it)" }, "contrast": { "words": 1, "kind": "number", "min": 0, "max": 40, "doc": "noise contrast: 1 is as generated, higher is harsher" }, "threshold": { "words": 1, "kind": "number", "min": 0, "max": 1, "doc": "noise cut-off: only values above it show (glitter uses a high one)" }, "contour": { "words": 1, "kind": "number", "min": 0.005, "max": 0.5, "doc": "draw thin lines where the noise crosses the threshold, instead of a plain cut: veins, rings, contours" }, "octaves": { "words": 1, "kind": "number", "min": 1, "max": 8, "int": true, "doc": "noise detail layers, 1 is smooth, 5 is rough" }, "seed": { "words": 1, "kind": "number", "min": 0, "max": 99999, "int": true, "doc": "a different random pattern with the same look" }, "stretch": { "words": 2, "kind": "numbers", "min": 0.1, "max": 200, "doc": "stretch noise features along x and y, e.g. stretch 40 1 for wood grain" }, "depth": { "words": 1, "kind": "number", "min": 0, "max": 30, "doc": "bump height: how deep the relief looks" }, "light": { "words": 1, "kind": "number", "min": -360, "max": 360, "doc": "bump light direction in degrees" }, "angle": { "words": 1, "kind": "number", "min": -360, "max": 360, "doc": "direction of lines and patterns, in degrees" }, "thickness": { "words": 1, "kind": "number", "min": 0.1, "max": 500, "doc": "line or grid-line width in px" }, "radius": { "words": 1, "kind": "number", "min": 0.02, "max": 1, "doc": "dot size as a fraction of the cell (plaid: how wide the bands are as a fraction of the repeat)" }, "softness": { "words": 1, "kind": "number", "min": 0, "max": 1, "doc": "how soft the edges of dots and lines are" }, "animate": { "words": 1, "kind": "number", "min": 0, "max": 60000, "doc": "milliseconds per shimmer step (film-grain flicker); 0 is still" }, "type": { "words": 1, "kind": "word", "values": [ "fractal", "turbulence" ], "doc": "noise flavour: fractal is clouds, turbulence is veins" }, "blend": { "words": 1, "kind": "word", "values": [ "normal", "multiply", "screen", "overlay", "soft-light", "hard-light", "color-burn", "color-dodge", "darken", "lighten", "difference", "exclusion" ], "doc": "how the layer mixes with what is under it" }, "color": { "words": 1, "kind": "color", "doc": "the main colour (dark end of noise, ink of lines and dots)" }, "color2": { "words": 1, "kind": "color", "doc": "the second colour (light end of noise, background cell of patterns)" }, "figure": { "words": 1, "kind": "number", "min": 0, "max": 1, "doc": "rings generator: how strongly the growth rings arch into a cathedral figure, 0 is straight grain" }, "warp": { "words": 1, "kind": "number", "min": 0, "max": 1, "doc": "rings generator: how much each ring wobbles along its length" }, "pores": { "words": 1, "kind": "number", "min": 0, "max": 1, "doc": "rings generator: fine fibre and pore streaks between the rings" }, "knots": { "words": 1, "kind": "number", "min": 0, "max": 8, "int": true, "doc": "rings generator: how many knots in one tile (the pattern repeats, so keep it small)" }, "planks": { "words": 1, "kind": "number", "min": 24, "max": 1200, "doc": "rings generator: lay it out as planks this many px tall, with a seam and a slightly different board each" }, "symmetrical": { "words": 1, "kind": "word", "values": [ "both", "x", "y" ], "optional": true, "doc": "mirror every other tile, so each edge meets its own reflection: no seam, and the repeat is twice as far apart. x mirrors left to right, y top to bottom, both (the default) does both. Works on the image-based textures (noise, bump, rings, waves, hex)." }, "density": { "words": 1, "kind": "number", "min": 0.05, "max": 20, "doc": "starfield and terrazzo: how many stars or chips in a tile, 1 is normal" }, "invert": { "words": 0, "kind": "flag", "doc": "swap the two colours" } }, "presetNames": [ "grain", "noise", "rough", "sand", "paper", "cloud", "concrete", "stone", "crumpled", "glitter", "frost", "marble", "wood", "oak", "walnut", "cherry", "maple", "pine", "mahogany", "ebony", "birch", "oak-planks", "walnut-planks", "bark", "leather", "brushed", "canvas", "linen", "denim", "carbon", "scanlines", "halftone", "dots", "lines", "grid", "checker", "crosshatch", "stripes", "waves", "hex", "bricks", "bricks-old", "herringbone", "plaid", "tartan", "gingham", "scales", "mermaid", "shingles", "chevron", "argyle", "lowpoly", "tiles", "blueprint", "granite", "slate", "sandstone", "terrazzo", "confetti", "rust", "corrugated", "cork", "kraft", "felt", "burlap", "stucco", "starfield", "snow", "grass", "water", "rain", "lava", "topo" ], "presets": { "grain": { "doc": "fine film grain, neutral on any colour", "mask": true, "layers": [ { "gen": "noise", "scale": 1.1, "octaves": 2, "contrast": 1.7, "intensity": 0.5, "color": "#000", "color2": "#fff", "blend": "overlay" } ] }, "noise": { "doc": "coarser static", "mask": true, "layers": [ { "gen": "noise", "scale": 2.6, "octaves": 3, "contrast": 1.9, "intensity": 0.5, "color": "#000", "color2": "#fff", "blend": "overlay" } ] }, "rough": { "doc": "gritty relief, like a rough cast wall", "mask": true, "layers": [ { "gen": "bump", "scale": 3, "octaves": 4, "depth": 3.4, "light": 135, "intensity": 0.75, "color": "#000", "color2": "#fff", "blend": "overlay" } ] }, "sand": { "doc": "warm fine sand grains", "mask": true, "layers": [ { "gen": "bump", "scale": 1.5, "octaves": 3, "depth": 2.2, "light": 130, "intensity": 0.7, "color": "#5a4426", "color2": "#fff1d0", "blend": "overlay" } ] }, "paper": { "doc": "soft paper fibre with a little unevenness", "layers": [ { "gen": "noise", "scale": 1.5, "octaves": 4, "contrast": 1.2, "intensity": 0.3, "color": "#000", "color2": "#fff", "blend": "overlay" }, { "gen": "noise", "scale": 120, "octaves": 3, "contrast": 1.3, "intensity": 0.25, "color": "#000", "color2": "#fff", "blend": "soft-light", "seed": 7 } ] }, "cloud": { "doc": "big soft cloudy variation", "mask": true, "layers": [ { "gen": "noise", "scale": 90, "octaves": 5, "contrast": 1.6, "intensity": 0.7, "color": "#000", "color2": "#fff", "blend": "soft-light" } ] }, "concrete": { "doc": "pitted concrete", "layers": [ { "gen": "bump", "scale": 6, "octaves": 5, "depth": 2.6, "light": 135, "intensity": 0.7, "color": "#000", "color2": "#fff", "blend": "overlay" }, { "gen": "noise", "scale": 140, "octaves": 4, "contrast": 1.5, "intensity": 0.45, "color": "#000", "color2": "#fff", "blend": "soft-light", "seed": 3 } ] }, "stone": { "doc": "carved stone with broad relief", "layers": [ { "gen": "bump", "scale": 26, "octaves": 5, "depth": 2.4, "light": 125, "intensity": 0.75, "color": "#000", "color2": "#fff", "blend": "overlay" } ] }, "crumpled": { "doc": "crumpled foil or paper, big creases", "layers": [ { "gen": "bump", "scale": 34, "octaves": 4, "depth": 4, "light": 135, "intensity": 0.8, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 11 } ] }, "glitter": { "doc": "sparse bright sparkles", "mask": true, "layers": [ { "gen": "noise", "scale": 1.2, "octaves": 1, "contrast": 16, "threshold": 0.66, "intensity": 1, "color": "rgba(255,255,255,0)", "color2": "#fff", "blend": "screen", "seed": 5 } ] }, "frost": { "doc": "fine icy crystals", "layers": [ { "gen": "bump", "scale": 2.2, "octaves": 4, "depth": 3.2, "light": 140, "intensity": 0.95, "color": "rgba(160,210,255,0)", "color2": "#ffffff", "blend": "screen" } ] }, "marble": { "doc": "veined marble", "layers": [ { "gen": "noise", "scale": 120, "octaves": 5, "contour": 0.035, "threshold": 0.5, "intensity": 0.9, "color": "#6c6877", "color2": "rgba(247,245,240,0)", "blend": "multiply", "seed": 4 }, { "gen": "noise", "scale": 120, "octaves": 5, "contour": 0.16, "threshold": 0.5, "intensity": 0.25, "color": "#9b97a6", "color2": "rgba(247,245,240,0)", "blend": "multiply", "seed": 4 }, { "gen": "noise", "scale": 200, "octaves": 3, "contrast": 1.4, "intensity": 0.3, "color": "#cfc9c0", "color2": "#fbfaf7", "blend": "soft-light", "seed": 21 } ] }, "wood": { "doc": "long wood grain, along x (use angle 90 for vertical)", "layers": [ { "gen": "noise", "scale": 4, "octaves": 3, "contrast": 1.8, "stretch": [ 40, 1 ], "intensity": 1, "color": "#7a4b24", "color2": "#c99a62", "blend": "multiply" } ] }, "oak": { "doc": "oak: open grain, tan with brown rings", "layers": [ { "gen": "rings", "scale": 11, "color": "#8a5f33", "color2": "#c9a574", "contrast": 1.3, "figure": 0.55, "warp": 0.45, "pores": 0.5, "seed": 3, "blend": "normal" } ] }, "walnut": { "doc": "walnut: dark chocolate with black-brown rings", "layers": [ { "gen": "rings", "scale": 9, "color": "#2b1a10", "color2": "#6a4631", "contrast": 1.2, "figure": 0.5, "warp": 0.55, "pores": 0.45, "seed": 8, "blend": "normal" } ] }, "cherry": { "doc": "cherry: warm red-brown with fine rings", "layers": [ { "gen": "rings", "scale": 8, "color": "#7a3a1c", "color2": "#bb7443", "contrast": 1.1, "figure": 0.4, "warp": 0.35, "pores": 0.35, "seed": 5, "blend": "normal" } ] }, "maple": { "doc": "maple: pale, tight, nearly plain grain", "layers": [ { "gen": "rings", "scale": 13, "color": "#c79a5a", "color2": "#ecd6ab", "contrast": 0.8, "figure": 0.25, "warp": 0.3, "pores": 0.25, "seed": 11, "blend": "normal" } ] }, "pine": { "doc": "pine: light yellow wood with wide rings and knots", "layers": [ { "gen": "rings", "scale": 16, "color": "#b5742f", "color2": "#e6c081", "contrast": 1.4, "figure": 0.65, "warp": 0.5, "pores": 0.4, "knots": 2, "seed": 14, "blend": "normal" } ] }, "mahogany": { "doc": "mahogany: deep red-brown, straight grain", "layers": [ { "gen": "rings", "scale": 10, "color": "#4a2012", "color2": "#8c4727", "contrast": 1.1, "figure": 0.3, "warp": 0.3, "pores": 0.4, "seed": 6, "blend": "normal" } ] }, "ebony": { "doc": "ebony: nearly black with faint streaks", "layers": [ { "gen": "rings", "scale": 12, "color": "#0c0908", "color2": "#2d2621", "contrast": 0.7, "figure": 0.2, "warp": 0.25, "pores": 0.3, "seed": 2, "blend": "normal" } ] }, "birch": { "doc": "birch: creamy pale wood with fine rings", "layers": [ { "gen": "rings", "scale": 10, "color": "#d2ae74", "color2": "#f0dfb9", "contrast": 0.9, "figure": 0.3, "warp": 0.35, "pores": 0.25, "seed": 9, "blend": "normal" } ] }, "oak-planks": { "doc": "oak laid as planks, with seams", "layers": [ { "gen": "rings", "scale": 11, "color": "#8a5f33", "color2": "#c9a574", "contrast": 1.3, "figure": 0.55, "warp": 0.45, "pores": 0.5, "planks": 110, "seed": 3, "blend": "normal" } ] }, "walnut-planks": { "doc": "walnut laid as planks, with seams", "layers": [ { "gen": "rings", "scale": 9, "color": "#2b1a10", "color2": "#6a4631", "contrast": 1.2, "figure": 0.5, "warp": 0.55, "pores": 0.45, "planks": 96, "seed": 8, "blend": "normal" } ] }, "bark": { "doc": "rough vertical bark", "layers": [ { "gen": "bump", "scale": 10, "octaves": 4, "depth": 5, "stretch": [ 1, 6 ], "light": 150, "intensity": 0.8, "color": "#000", "color2": "#fff", "blend": "overlay" } ] }, "leather": { "doc": "pebbled leather", "layers": [ { "gen": "bump", "scale": 5, "octaves": 2, "depth": 4.2, "light": 120, "intensity": 0.85, "color": "#000", "color2": "#fff", "blend": "overlay" } ] }, "brushed": { "doc": "brushed metal, fine lines along x", "layers": [ { "gen": "noise", "scale": 1.2, "octaves": 2, "contrast": 1.5, "stretch": [ 60, 1 ], "intensity": 0.5, "color": "#000", "color2": "#fff", "blend": "overlay" } ] }, "canvas": { "doc": "artist canvas weave", "layers": [ { "gen": "weave", "scale": 3, "thickness": 1, "intensity": 0.5, "color": "#000", "blend": "multiply" }, { "gen": "noise", "scale": 1.4, "octaves": 3, "contrast": 1.3, "intensity": 0.3, "color": "#000", "color2": "#fff", "blend": "overlay" } ] }, "linen": { "doc": "loose linen weave with slubs", "layers": [ { "gen": "weave", "scale": 4, "thickness": 1.2, "intensity": 0.4, "color": "#5a4a32", "blend": "multiply" }, { "gen": "noise", "scale": 80, "octaves": 3, "contrast": 1.4, "stretch": [ 8, 1 ], "intensity": 0.25, "color": "#000", "color2": "#fff", "blend": "soft-light", "seed": 9 } ] }, "denim": { "doc": "diagonal twill, blue by default", "layers": [ { "gen": "lines", "angle": 45, "scale": 3, "thickness": 1.4, "intensity": 0.45, "color": "#0d2147", "blend": "multiply" }, { "gen": "noise", "scale": 1.3, "octaves": 3, "contrast": 1.4, "intensity": 0.3, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 2 } ] }, "carbon": { "doc": "carbon fibre twill", "layers": [ { "gen": "carbon", "scale": 20, "intensity": 1, "color": "#151515", "color2": "#262626", "blend": "normal" } ] }, "scanlines": { "doc": "CRT scanlines", "layers": [ { "gen": "lines", "angle": 0, "scale": 4, "thickness": 2, "intensity": 0.28, "color": "#000", "blend": "normal" } ] }, "halftone": { "doc": "newsprint dots", "layers": [ { "gen": "dots", "scale": 8, "radius": 0.2, "softness": 0.2, "intensity": 0.55, "color": "#000", "blend": "multiply", "stagger": true } ] }, "dots": { "doc": "a plain dot grid", "layers": [ { "gen": "dots", "scale": 14, "radius": 0.16, "softness": 0.05, "intensity": 0.35, "color": "#000", "blend": "normal" } ] }, "lines": { "doc": "diagonal hairlines", "layers": [ { "gen": "lines", "angle": 45, "scale": 8, "thickness": 1, "intensity": 0.3, "color": "#000", "blend": "normal" } ] }, "grid": { "doc": "a square grid, like graph paper", "layers": [ { "gen": "grid", "scale": 24, "thickness": 1, "intensity": 0.25, "color": "#000", "blend": "normal" } ] }, "checker": { "doc": "checkerboard", "layers": [ { "gen": "checker", "scale": 24, "intensity": 0.12, "color": "#000", "blend": "normal" } ] }, "crosshatch": { "doc": "crossed hairlines", "layers": [ { "gen": "lines", "angle": 45, "scale": 6, "thickness": 1, "intensity": 0.28, "color": "#000", "blend": "normal" }, { "gen": "lines", "angle": -45, "scale": 6, "thickness": 1, "intensity": 0.28, "color": "#000", "blend": "normal" } ] }, "stripes": { "doc": "bold diagonal stripes", "layers": [ { "gen": "lines", "angle": 45, "scale": 32, "thickness": 16, "intensity": 0.12, "color": "#000", "blend": "normal" } ] }, "waves": { "doc": "soft repeating waves", "layers": [ { "gen": "waves", "scale": 40, "thickness": 1.2, "intensity": 0.3, "color": "#000", "blend": "normal" } ] }, "hex": { "doc": "honeycomb", "layers": [ { "gen": "hex", "scale": 28, "thickness": 1, "intensity": 0.28, "color": "#000", "blend": "normal" } ] }, "bricks": { "doc": "a red brick wall, light mortar", "layers": [ { "gen": "bump", "scale": 3, "octaves": 3, "depth": 2.2, "light": 135, "intensity": 0.55, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 3 }, { "gen": "bricks", "scale": 56, "thickness": 3.5, "intensity": 1, "color": "#d9d0c4", "color2": "#a4402b", "blend": "normal" } ] }, "bricks-old": { "doc": "weathered dark brick", "layers": [ { "gen": "noise", "scale": 40, "octaves": 4, "contrast": 1.5, "intensity": 0.5, "color": "#000", "color2": "#fff", "blend": "soft-light", "seed": 12 }, { "gen": "bump", "scale": 3, "octaves": 4, "depth": 3.2, "light": 135, "intensity": 0.7, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 5 }, { "gen": "bricks", "scale": 52, "thickness": 4, "intensity": 1, "color": "#6d665e", "color2": "#74301f", "blend": "normal" } ] }, "herringbone": { "doc": "parquet laid in a zigzag, every board a slightly different shade", "layers": [ { "gen": "noise", "scale": 1.2, "octaves": 3, "contrast": 1.4, "stretch": [ 30, 1 ], "intensity": 0.25, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 4 }, { "gen": "herringbone", "scale": 22, "thickness": 1.4, "intensity": 1, "color": "#2a1a0e", "color2": "#b9854d", "seed": 4, "blend": "normal" } ] }, "plaid": { "doc": "simple plaid: wide bands crossing, thin lines between", "layers": [ { "gen": "plaid", "scale": 64, "thickness": 2, "intensity": 0.5, "color": "#9b1b1b", "blend": "multiply" } ] }, "tartan": { "doc": "a red tartan with green and navy bands", "layers": [ { "gen": "plaid", "scale": 96, "thickness": 3, "radius": 0.18, "intensity": 0.6, "color": "#0f1f55", "blend": "multiply" }, { "gen": "plaid", "scale": 48, "thickness": 2, "radius": 0.3, "intensity": 0.65, "color": "#12503a", "blend": "multiply" }, { "gen": "plaid", "scale": 48, "thickness": 1, "radius": 0.001, "intensity": 1, "color": "#a11d24", "color2": "#a11d24", "blend": "normal" } ] }, "gingham": { "doc": "small checks, the picnic cloth", "layers": [ { "gen": "plaid", "scale": 28, "thickness": 1, "radius": 0.5, "intensity": 0.5, "color": "#c0392b", "color2": "#ffffff", "blend": "normal" } ] }, "scales": { "doc": "overlapping scales", "layers": [ { "gen": "scales", "scale": 36, "thickness": 1.2, "intensity": 0.4, "color": "#000", "blend": "normal" } ] }, "mermaid": { "doc": "teal fish scales", "layers": [ { "gen": "scales", "scale": 34, "thickness": 1.4, "intensity": 1, "color": "#0a5560", "color2": "#1fa8a0", "blend": "normal" } ] }, "shingles": { "doc": "roof shingles", "layers": [ { "gen": "scales", "scale": 60, "thickness": 2, "intensity": 1, "color": "#201c1a", "color2": "#5b4a42", "blend": "normal" } ] }, "chevron": { "doc": "zigzag bands", "layers": [ { "gen": "chevron", "scale": 40, "thickness": 6, "intensity": 0.3, "color": "#000", "blend": "normal" } ] }, "argyle": { "doc": "a diamond lattice, filled", "layers": [ { "gen": "diamonds", "scale": 44, "thickness": 1.4, "intensity": 0.9, "color": "#e8e0d0", "color2": "#2f3e6b", "blend": "normal" } ] }, "lowpoly": { "doc": "low-poly facets in two tones", "layers": [ { "gen": "triangles", "scale": 72, "intensity": 0.5, "color": "#000", "color2": "#fff", "seed": 3, "blend": "overlay" } ] }, "tiles": { "doc": "square tiles with grout", "layers": [ { "gen": "bump", "scale": 40, "octaves": 2, "depth": 1.4, "light": 135, "intensity": 0.4, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 6 }, { "gen": "grid", "scale": 64, "thickness": 3, "intensity": 0.5, "color": "#000", "blend": "normal" } ] }, "blueprint": { "doc": "drafting grid, fine and coarse", "layers": [ { "gen": "grid", "scale": 100, "thickness": 1.4, "intensity": 0.5, "color": "#ffffff", "blend": "normal" }, { "gen": "grid", "scale": 20, "thickness": 1, "intensity": 0.22, "color": "#ffffff", "blend": "normal" } ] }, "granite": { "doc": "speckled granite", "layers": [ { "gen": "noise", "scale": 1.8, "octaves": 1, "contrast": 9, "threshold": 0.62, "intensity": 0.5, "color": "rgba(0,0,0,0)", "color2": "#000", "blend": "multiply", "seed": 2 }, { "gen": "noise", "scale": 1.8, "octaves": 1, "contrast": 9, "threshold": 0.7, "intensity": 0.55, "color": "rgba(255,255,255,0)", "color2": "#fff", "blend": "screen", "seed": 7 }, { "gen": "bump", "scale": 8, "octaves": 3, "depth": 1.2, "light": 135, "intensity": 0.4, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 4 } ] }, "slate": { "doc": "layered slate", "layers": [ { "gen": "bump", "scale": 18, "octaves": 4, "depth": 2.4, "stretch": [ 2.4, 1 ], "light": 135, "intensity": 0.8, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 5 }, { "gen": "noise", "scale": 90, "octaves": 3, "contrast": 1.4, "intensity": 0.35, "color": "#000", "color2": "#fff", "blend": "soft-light", "seed": 8 } ] }, "sandstone": { "doc": "banded sandstone", "layers": [ { "gen": "bump", "scale": 3, "octaves": 3, "depth": 1.6, "light": 130, "intensity": 0.5, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 9 }, { "gen": "noise", "scale": 10, "octaves": 3, "contrast": 1.6, "stretch": [ 30, 1 ], "intensity": 0.8, "color": "#8a5a3a", "color2": "#e2b784", "blend": "multiply", "seed": 14 } ] }, "terrazzo": { "doc": "chips of stone in cement", "layers": [ { "gen": "terrazzo", "scale": 240, "density": 1, "intensity": 0.9, "color": "#c9a98f", "color2": "#6b7a8f", "seed": 6, "blend": "normal" } ] }, "confetti": { "doc": "bright scraps scattered, flat", "layers": [ { "gen": "terrazzo", "scale": 260, "density": 0.5, "intensity": 1, "color": "#ff4d6d", "color2": "#4dabf7", "seed": 11, "blend": "normal" } ] }, "rust": { "doc": "rusted metal", "layers": [ { "gen": "bump", "scale": 4, "octaves": 4, "depth": 3, "light": 135, "intensity": 0.6, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 3 }, { "gen": "noise", "scale": 70, "octaves": 5, "contrast": 1.9, "intensity": 0.85, "color": "#3b1d0b", "color2": "#b4602a", "blend": "multiply", "seed": 5 } ] }, "corrugated": { "doc": "corrugated metal sheet", "layers": [ { "gen": "lines", "angle": 90, "scale": 12, "thickness": 6, "softness": 1, "intensity": 0.3, "color": "#000", "blend": "overlay" } ] }, "cork": { "doc": "cork board", "layers": [ { "gen": "bump", "scale": 4, "octaves": 3, "depth": 3, "light": 135, "intensity": 0.7, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 2 }, { "gen": "noise", "scale": 3, "octaves": 3, "contrast": 2.2, "intensity": 0.8, "color": "#8a5a2b", "color2": "#d6a566", "blend": "multiply", "seed": 8 } ] }, "kraft": { "doc": "brown packing paper", "layers": [ { "gen": "noise", "scale": 1.4, "octaves": 3, "contrast": 1.4, "stretch": [ 6, 1 ], "intensity": 0.35, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 2 }, { "gen": "noise", "scale": 60, "octaves": 3, "contrast": 1.3, "intensity": 0.25, "color": "#6b4a2a", "color2": "#d1a874", "blend": "multiply", "seed": 7 } ] }, "felt": { "doc": "soft wool felt", "layers": [ { "gen": "noise", "scale": 1, "octaves": 4, "contrast": 1.2, "intensity": 0.45, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 3 }, { "gen": "noise", "scale": 40, "octaves": 3, "contrast": 1.2, "intensity": 0.2, "color": "#000", "color2": "#fff", "blend": "soft-light", "seed": 9 } ] }, "burlap": { "doc": "coarse sacking", "layers": [ { "gen": "weave", "scale": 7, "thickness": 2.2, "intensity": 0.55, "color": "#3b2a14", "blend": "multiply" }, { "gen": "noise", "scale": 30, "octaves": 3, "contrast": 1.5, "stretch": [ 6, 1 ], "intensity": 0.3, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 4 } ] }, "stucco": { "doc": "rough plaster", "layers": [ { "gen": "bump", "scale": 9, "octaves": 3, "depth": 3.6, "light": 135, "intensity": 0.7, "color": "#000", "color2": "#fff", "blend": "overlay", "seed": 6 }, { "gen": "noise", "scale": 120, "octaves": 3, "contrast": 1.2, "intensity": 0.2, "color": "#000", "color2": "#fff", "blend": "soft-light", "seed": 1 } ] }, "starfield": { "doc": "a night sky of small and large stars", "layers": [ { "gen": "starfield", "scale": 300, "thickness": 2.4, "density": 0.25, "intensity": 1, "color": "#cfe3ff", "seed": 9, "blend": "normal" }, { "gen": "starfield", "scale": 240, "thickness": 1.2, "density": 1.3, "intensity": 0.9, "color": "#ffffff", "seed": 5, "blend": "normal" } ] }, "snow": { "doc": "fresh snow with a few sparkles", "layers": [ { "gen": "noise", "scale": 1.2, "octaves": 1, "contrast": 16, "threshold": 0.72, "intensity": 1, "color": "rgba(255,255,255,0)", "color2": "#fff", "blend": "screen", "seed": 5 }, { "gen": "noise", "scale": 90, "octaves": 4, "contrast": 1.4, "intensity": 0.5, "color": "#9fb6d6", "color2": "#ffffff", "blend": "soft-light", "seed": 3 } ] }, "grass": { "doc": "blades of grass seen from above", "layers": [ { "gen": "noise", "scale": 2, "octaves": 4, "contrast": 2, "stretch": [ 1, 9 ], "intensity": 0.9, "color": "#2f6b2a", "color2": "#8cc152", "blend": "multiply", "seed": 4 } ] }, "water": { "doc": "water with light ripples", "layers": [ { "gen": "waves", "scale": 56, "thickness": 1.6, "intensity": 0.22, "color": "#ffffff", "blend": "normal" }, { "gen": "noise", "scale": 100, "octaves": 4, "contrast": 1.5, "intensity": 0.8, "color": "#0a3d62", "color2": "#3c9bd6", "blend": "multiply", "seed": 6 } ] }, "rain": { "doc": "slanted rain streaks", "layers": [ { "gen": "lines", "angle": 100, "scale": 14, "thickness": 1, "softness": 0.6, "intensity": 0.35, "color": "#ffffff", "blend": "normal" } ] }, "lava": { "doc": "glowing cracks in dark rock", "layers": [ { "gen": "noise", "scale": 90, "octaves": 4, "contour": 0.05, "threshold": 0.5, "intensity": 1, "color": "#ffb300", "color2": "rgba(255,60,0,0)", "blend": "screen", "seed": 7 }, { "gen": "noise", "scale": 60, "octaves": 5, "contrast": 1.8, "intensity": 0.9, "color": "#1a0500", "color2": "#7a1a00", "blend": "multiply", "seed": 3 } ] }, "topo": { "doc": "contour lines, like a map", "layers": [ { "gen": "noise", "scale": 140, "octaves": 4, "contour": 0.02, "threshold": 0.4, "intensity": 0.35, "color": "#000", "color2": "rgba(0,0,0,0)", "blend": "normal", "seed": 8 }, { "gen": "noise", "scale": 140, "octaves": 4, "contour": 0.02, "threshold": 0.5, "intensity": 0.5, "color": "#000", "color2": "rgba(0,0,0,0)", "blend": "normal", "seed": 8 }, { "gen": "noise", "scale": 140, "octaves": 4, "contour": 0.02, "threshold": 0.6, "intensity": 0.35, "color": "#000", "color2": "rgba(0,0,0,0)", "blend": "normal", "seed": 8 } ] } } }, "aura": { "fromWords": [ "edge", "outline", "bottom", "top", "left", "right", "center", "corners", "thumb" ], "shapes": [ "circle", "spark", "square", "ring", "star", "flame", "smoke", "line", "heart", "diamond", "triangle", "plus", "drop", "bubble", "snowflake", "confetti", "leaf" ], "dirWords": { "up": -90, "down": 90, "left": 180, "right": 0, "out": "out", "in": "in" }, "blends": [ "add", "normal" ], "glowKeys": { "color": { "kind": "color", "words": 1, "doc": "the light colour (default: the element's text colour)" }, "radius": { "kind": "number", "words": 1, "min": 1, "max": 400, "doc": "how far the glow reaches, in px" }, "intensity": { "kind": "number", "words": 1, "min": 0, "max": 4, "doc": "brightness, 1 is normal" }, "pulse": { "kind": "number", "words": 1, "min": 0, "max": 60000, "doc": "milliseconds for one breath in and out; 0 is steady" }, "depth": { "kind": "number", "words": 1, "min": 0, "max": 1, "doc": "how deep the pulse goes, 0 to 1" }, "flicker": { "kind": "number", "words": 1, "min": 0, "max": 1, "doc": "random flicker, like a flame: 0 is steady, 1 is wild" }, "seed": { "kind": "number", "words": 1, "min": 0, "max": 99999, "int": true, "doc": "a different random flicker with the same look" }, "texture": { "kind": "texture", "words": 1, "doc": "texture(grain scale 2): break the light up with a texture" }, "essential": { "kind": "flag", "words": 0, "doc": "keep animating even when the visitor prefers reduced motion" }, "unclipped": { "kind": "flag", "words": 0, "doc": "let the light spill out of a parent that clips (overflow: hidden, auto, scroll). Without it the aura is cut at that edge, like the element itself" }, "around": { "kind": "around", "words": 1, "doc": "the shape the light follows: follow (the default: the element's clip-path or rounded corners), box, round, pill, diamond, triangle, hexagon, octagon, pentagon, star, star4, star6, cross, heart, drop, bolt, alpha (an or 's visible pixels), or polygon(50% 0, 100% 50%, 50% 100%, 0 50%)" }, "inner": { "kind": "flag", "words": 0, "doc": "light inside the edge (a rim) instead of outside it" }, "rays": { "kind": "number", "words": 1, "min": 1, "max": 64, "int": true, "doc": "that many beams of light from the middle, slowly turning (see spin)" }, "spin": { "kind": "number", "words": 1, "min": -3600, "max": 3600, "doc": "rays turn this many degrees a second (default 10); on particles, how fast each one tumbles" }, "ripple": { "kind": "number", "words": 1, "min": 200, "max": 60000, "doc": "rings that spread out from the shape and fade, one every this many milliseconds" }, "nohalo": { "kind": "flag", "words": 0, "doc": "only the rays and ripples, without the soft halo" }, "always": { "kind": "flag", "words": 0, "doc": "keep emitting even when the element cannot be seen (opacity 0, display: none, visibility: hidden, on it or an ancestor): for an invisible anchor that smoke or sparks come out of" }, "z": { "kind": "number", "words": 1, "min": -1000000, "max": 2147483000, "int": true, "doc": "the z-index of the layer this light is drawn on: `z 5` puts it under a hill with z-index 10. It meets elements in the page's root stacking context" } }, "particleKeys": { "color": { "kind": "colors", "words": 1, "doc": "colours over a particle's life: color #ff0 -> #f60 -> transparent" }, "count": { "kind": "number", "words": 1, "min": 1, "max": 600, "int": true, "doc": "how many particles are alive at once" }, "size": { "kind": "range", "words": 2, "min": 0.5, "max": 300, "doc": "diameter in px: size 4, or size 10 4 (start and end of a random range)" }, "life": { "kind": "range", "words": 2, "min": 50, "max": 60000, "doc": "how long one lives, in ms: life 900, or life 600 1200" }, "speed": { "kind": "range", "words": 2, "min": 0, "max": 3000, "doc": "px per second: speed 60, or speed 30 90" }, "dir": { "kind": "dir", "words": 1, "doc": "where they head: up, down, left, right, out, in, or degrees (-90 is up)" }, "spread": { "kind": "number", "words": 1, "min": 0, "max": 360, "doc": "how wide the fan of directions is, in degrees" }, "gravity": { "kind": "number", "words": 1, "min": -2000, "max": 2000, "doc": "px/s squared; negative pulls up (flames), positive down (snow)" }, "drag": { "kind": "number", "words": 1, "min": 0, "max": 10, "doc": "air resistance: how fast particles slow down" }, "turbulence": { "kind": "number", "words": 1, "min": 0, "max": 1000, "doc": "random sideways wobble, px/s" }, "from": { "kind": "word", "words": 1, "values": [ "edge", "outline", "bottom", "top", "left", "right", "center", "corners", "thumb" ], "doc": "where they are born: edge or outline (along the element's real outline, see around), bottom, top, left, right, center, corners, thumb (range sliders)" }, "shape": { "kind": "word", "words": 1, "values": [ "circle", "spark", "square", "ring", "star", "flame", "smoke", "line", "heart", "diamond", "triangle", "plus", "drop", "bubble", "snowflake", "confetti", "leaf" ], "doc": "circle, spark, square, ring, star, flame, smoke, line, heart, diamond, triangle, plus, drop, bubble, snowflake, confetti or leaf" }, "grow": { "kind": "number", "words": 1, "min": 0, "max": 10, "doc": "size at the end of life as a multiple of the start: 0.2 shrinks, 3 swells" }, "blend": { "kind": "word", "words": 1, "values": [ "add", "normal" ], "doc": "add makes overlapping particles brighter, normal just stacks them" }, "glowing": { "kind": "flag", "words": 0, "doc": "soft glowing particles that add light" }, "behind": { "kind": "flag", "words": 0, "doc": "draw only outside the element's box, as if the element hid them" }, "seed": { "kind": "number", "words": 1, "min": 0, "max": 99999, "int": true, "doc": "a different random pattern with the same look" }, "texture": { "kind": "texture", "words": 1, "doc": "texture(grain): grainy particles" }, "essential": { "kind": "flag", "words": 0, "doc": "keep animating even when the visitor prefers reduced motion" }, "unclipped": { "kind": "flag", "words": 0, "doc": "let the particles leave a parent that clips (overflow: hidden, auto, scroll). Without it they are cut at that edge" }, "around": { "kind": "around", "words": 1, "doc": "the shape `from edge` and `from outline` follow: follow (the default), box, round, pill, diamond, triangle, hexagon, octagon, pentagon, star, star4, star6, cross, heart, drop, bolt, or polygon(...)" }, "palette": { "kind": "flag", "words": 0, "doc": "each particle takes ONE of the colours (confetti) instead of fading through them" }, "spin": { "kind": "number", "words": 1, "min": -3600, "max": 3600, "doc": "how fast each particle tumbles, in degrees a second (random direction)" }, "wind": { "kind": "number", "words": 1, "min": -3000, "max": 3000, "doc": "a sideways push, px/s squared; negative pushes left" }, "orbit": { "kind": "number", "words": 1, "min": -3600, "max": 3600, "doc": "the particles circle the middle of the element, this many degrees a second" }, "always": { "kind": "flag", "words": 0, "doc": "keep emitting even when the element cannot be seen (opacity 0, display: none, visibility: hidden, on it or an ancestor): for an invisible anchor that smoke or sparks come out of" }, "z": { "kind": "number", "words": 1, "min": -1000000, "max": 2147483000, "int": true, "doc": "the z-index of the layer these particles are drawn on: `z 5` puts them under a hill with z-index 10. It meets elements in the page's root stacking context" } }, "glowDefaults": { "radius": 24, "intensity": 1, "pulse": 0, "depth": 0.35, "flicker": 0, "seed": 1 }, "particleDefaults": { "count": 40, "size": [ 4, 4 ], "life": [ 900, 900 ], "speed": [ 40, 40 ], "dir": -90, "spread": 30, "gravity": 0, "drag": 0, "turbulence": 0, "from": "edge", "shape": "circle", "grow": 0.3, "blend": null, "glowing": false, "seed": 1 }, "aroundNames": [ "follow", "box", "round", "pill", "alpha", "diamond", "triangle", "hexagon", "octagon", "pentagon", "star", "star4", "star6", "cross", "heart", "drop", "bolt" ] }, "slider": { "clauses": { "track": "track [height] [color] [radius |full]", "fill": "fill | fill none", "thumb": "thumb [color]", "shape": "shape circle | square | diamond | pill | bar", "ring": "ring ", "glow": "glow ", "ticks": "ticks [color] [length]", "graph": "graph ... (each 0 to 100)", "graph-height": "graph-height ", "graph-gap": "graph-gap " }, "thumbShapes": [ "circle", "square", "diamond", "pill", "bar" ] }, "effects": { "glassWords": { "blur": "a number: how many px to blur what is behind the element (default 16)", "saturate": "saturate : colour boost for what shows through, 1 is unchanged (default 1.5)", "bright": "bright : brightness of what shows through, 1 is unchanged", "tint": "tint | tint none: the milky layer on top (default: a faint wash of the text colour)" }, "tiltWords": { "max": "a number: the largest tilt in degrees (default 8)", "lift": "lift : scale while the pointer is over it, e.g. 1.04", "perspective": "perspective : how strong the 3D depth looks (default 900)", "speed": "speed <0.05 to 1>: how quickly it follows (default 0.18)", "invert": "invert: tilt away from the pointer instead of toward it", "glare": "glare: also keep --dssl-gx and --dssl-gy (0% to 100%) pointing at the pointer, for your own highlight" } }, "fonts": { "words": { "weights": "a weight (400), several (400 700), or a variable range (100..900)", "italic": "also load the italic of each weight", "display": "display : how the text behaves while the font loads (default swap)", "from": "from \"/path/to/file.woff2\": use your own file instead of Google Fonts" } } }