UI Buddy

Component Overrides

Learn how to override a component's styles.

If only I could just change...

There may be times when you feel like changing just one or a few styles of a component for a specific use case. For example, you might want to increase the size of a button to grab your user's attention. Instead of creating a new button component with the increased size, you can just override the sizing properties of an existing component and you're good to go.

// A SIMPLE BUTTON ELEMENT
<button component="btn" class="...define your classes here..."></button>

// USING BUTTON AND OVERRIDING
<button class="btn height:100px width:200px"></button>

All the classes other than the component class will override everything that is defined in the component, without affecting the original component whatsoever.