# Button

**Path:** Components/Interactive

[Back to Documentation Index](http://rubicblazor.skyconis.com/docs.md)

---

Button

 A RbButton component is a button with material design theme and comes with multiple variants, for actions, links and commands.

 Keyboard Navigation
 RbButton accepts keys to keyboard navigation.

 Space , Enter or NumpadEnter fires click event

 Events

 Show code

 Click Me Async 

 Href

 Show code

 Open Google on new tab.

 Colors

 Show code

 Normal Default 
 Primary 
 Secondary 
 Info 
 Warning 
 Danger 
 Success 

 Filled Default 
 Primary 
 Secondary 
 Info 
 Warning 
 Danger 
 Success 

 Outlined Default 
 Primary 
 Secondary 
 Info 
 Warning 
 Danger 
 Success 

 Readonly / Disabled

 Readonly does NOT allow click or input events.

 Disabled does NOT allow anything.

 Show code

 Normal 

 Readonly 

 Disabled 

 Position

 Show code

 Icon Position 

 Left 
 Right 
 Top 
 Bottom 

 Alignment 

 Start 
 End 
 Center 
 Justify 

 Label 

 Tooltip

 Show code

 With No Tooltip 

 Default Tooltip 

 Custom Tooltip 

 Rounded

 Show code

 Filled 
 Default 

 Rounded 

 Outlined 
 Default 

 Rounded 

 Hover

 Show code

 Default 

 No Hover 

 Icon

 Show code

 Icon + Text 

 Only Text 

 Image 

 Toggle

 A toggleable implementation of RbButton allows the user to make a toggling between choices.

 Show code

 Item 1 

 Item 2 

 Item 3 

 Item 1 

 Item 2 

 Item 3 

 Circle

 Circle buttons similar to default button but it allows only Icon , Image or Letter .

 Show code

 Icon

 Image

 Letter

 N

 F

 O

 RTL Support

 Demonstrate button labels and icons inside an RTL container.

 Show code

 إرسال الطلب 

 إشعار جديد 

 تأكيد العملية 

 ✕

 Contents