UI Buddy

Responsiveness

Learn how to give responsive styles to your elements.

media:property:value

Just add a responsive media prefix before any property:value pair and watch it magically apply at that specified breakpoint. For instance:

<p class="fontSize:16px md:fontSize:24px"></p>

In this example, the paragraph element has a font size of 24px for medium-sized screens and above, and 16px font size for smaller screen sizes.

The following table lists all supported media prefixes:

PrefixDescriptionRange
xsExtra-Small0px and above
smSmall600px and above
mdMedium960px and above
lgLarge1280px and above
xlExtra-Large1920px and above