pantoken / colors

colors ​

Béite

@pantoken/plugin-colors — matamaitic dathanna CSS-amháin a léiríonn an InstUI @instructure/ui-color-utils fheidhmeanna cúnta (alpha, darken, lighten, overlayColors).

Ríomhann InstUI iad ag am an tógála le tinycolor2 i gcoinne luachanna hex shoiléire. Seolann pantoken tagairtí var(--instui-*) a réitítear sa bhrabhsálaí (go minic trí light-dark()), mar sin caithfidh an matamaitic tarlú i CSS ina ionad. Tugann gach feidhm chúnta sreang dath CSS tógtha ó color-mix() agus relative color syntax — ar aon ghnéithe bunlíne brabhsálaithe nua-aimseartha — mar sin rianóidh aon abairt amháin an token fiú nuair is péire light-dark() í atá spleách ar scéim. Bain úsáid astu in aon áit a bheadh tú, murach sin, ag códú scáth díorthaithe go Cruinn.

Sampla ​

ts
import { alpha, darken } from "@pantoken/plugin-colors";

// A subtle brand-tinted hover, derived from the brand token (mirrors InstUI's ghost hover).
const hover = alpha(darken("var(--instui-color-institutional-brand-button-primary-bgd)", 10), 10);
// → "color-mix(in srgb, hsl(from var(--…brand-…) h s calc(l - 10)) 10%, transparent)"

Aliasanna Cineál ​

Feidhmeanna ​