دایرکتیو nuiButton به یک <button> یا <a> بومی استایل می‌دهد. عنصر همچنان سمنتیک، رفتار صفحه‌کلید و مشارکت خود در فرم‌ها را حفظ می‌کند؛ کار دایرکتیو فقط این است که ورودی‌هایش را روی اتریبیوت‌های data که استایل‌شیت هدف می‌گیرد منعکس کند.

برای اقدام‌ها از <button> و برای پیمایش از <a> استفاده کنید. ظاهر هر دو یکسان است و هر دو از disabled پشتیبانی می‌کنند.

گونه‌ها

چهار سبک پرشدگی، از برجسته‌ترین تا کم‌جلوه‌ترین. برای اقدام اصلی، در هر نما فقط یک دکمهٔ solid به کار ببرید.

رنگ‌ها

ورودی tone پالت رنگ را تعیین می‌کند: accent برای مسیر اصلی، neutral برای اقدام‌های ثانویه و danger برای اقدام‌های مخرب.

اندازه‌ها

سه ارتفاع: ۲۸، ۳۶ و ۴۴ پیکسل. حتی کوچک‌ترین آن‌ها هم از حداقل اندازهٔ هدف در WCAG 2.2 بزرگ‌تر است.

لینک‌ها را نمی‌توان به‌صورت بومی غیرفعال کرد؛ برای همین لینک غیرفعال aria-disabled="true" می‌گیرد و کلیک‌هایش مسدود می‌شود، حتی با routerLink.

جلوه‌های فشردن

هر کدام را فشار دهید و نگه دارید. press تعیین می‌کند دکمه وقتی فشرده نگه داشته می‌شود چه کند، و motion فنری را تعیین می‌کند که دکمه با آن برمی‌گردد. data-nui-press را روی هر عنصری بگذارید تا برای همهٔ محتوای درون آن اعمال شود.

گوشه‌ها، شعاع و تراکم

corners شکل گوشه‌ها را تغییر می‌دهد، radius اندازهٔ آن‌ها را و density فضایی را که دکمه اشغال می‌کند، بی‌آنکه دکمه هرگز از اندازهٔ هدف ۲۴ پیکسلی کوچک‌تر شود. مرورگرهایی که از corner-shape پشتیبانی نمی‌کنند، گوشه‌ها را گرد رسم می‌کنند.