Needless UI

Komponen

Pamilih werna

Werna ing OKLCH, kanthi slider, conto werna, pipet lan pamriksan kontras.

Import

import-color-picker.ts
import { NuiColorPicker, nuiParseColor } from '@needless-ui/angular/color-picker';

NuiColorPicker

Pamilih werna ing OKLCH.

Selector
nui-color-picker
JenengJinisGawanKatrangan
valueRong arahstring''Werna, ditulis miturut format. Kosong nganti ana sing dipilih.
formatRong arah'hex' | 'rgb' | 'hsl' | 'oklch' | 'p3''hex'Carane nilai ditulis.
formatsInputNuiColorFormat[]hex, rgb, hsl, oklchFormat-format sing diliwati tombol format.
gamutInput'srgb' | 'p3''srgb'Werna sing ana ing area: sRGB, utawa Display P3.
alphaInputbooleantrueNampilake slider opasitas.
swatchesInputNuiColorSwatch[][]Werna kanggo dipilih, kanthi jeneng.
contrastWithInputstringLatar mburi kanggo mriksa kontras.
eyeDropperInputbooleantrueNampilake pipet, yen browser duwe.
disabledInputbooleanfalseOra bisa diowahi.
labelsInputPartial<NuiColorPickerLabels>Saben teks sing diucapake pamilih, kanggo diterjemahake.
colorPropertiSignal<NuiColor>Werna sing dipilih, ing OKLCH.

Helpers

Fungsi kanggo werna.

JenengJinisGawanKatrangan
nuiParseColorMetode(text: string) => NuiColor | nullMaca werna ing sintaks CSS apa wae.
nuiFormatColorMetode(color, format?) => stringNulis werna ing sawijining format.
nuiToGamutMetode(color, gamut?: 'srgb' | 'p3') => NuiColorNggawa werna mlebu sRGB utawa Display P3, kaya CSS.
nuiContrastMetode(color, background) => numberRasio kontras WCAG 2 sawijining werna ing latar mburi.