Filter Blur

Terapkan penapis kabur

Sintaks

visual="blur:[value]"

Nilai

Nilai	CSS Output	Huraian
none	filter: blur(0)	Tiada kabur
tiny	filter: blur(2px)	Kabur kecil
small	filter: blur(4px)	Kabur kecil
medium	filter: blur(8px)	Kabur sederhana
big	filter: blur(12px)	Kabur besar
giant	filter: blur(24px)	Kabur gergasi
vast	filter: blur(48px)	Kabur luas

Contoh

<div visual="blur:medium">Blurred element</div>

Pratonton

Kabur

visual="blur:small" - Terapkan penapis kabur gaussian pada elemen

none

tiny

small

Lihat Kod

<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <div space="p:small" visual="bg:primary text:white rounded:small blur:none">none</div>
  <div space="p:small" visual="bg:primary text:white rounded:small blur:tiny">tiny</div>
  <div space="p:small" visual="bg:primary text:white rounded:small blur:small">small</div>
</div>

Nilai Arbitrari

Sokong nilai tersuai menggunakan sintaks kurungan segi empat:

<div visual="filter:[custom-value]">Custom</div>