Feather UI includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance.
It comes with different flexible spacing utilities of different sizes, such as- extra-small, small, medium, large, extra-large,and extra-extra-large. The sizes are defined as -

• xs for extra-small (0.5rem)
• sm for small (1rem)
• md for medium (1.5rem)
• lg for large (2rem)
• xl for extra-large (2.5rem)
• xxl for extra-extra-large (3rem)

The Padding component comes with different flexible sizes, which can be used as -

• pad-xs
• pad-sm
• pad-md
• pad-lg
• pad-xl
• pad-xxl

The Margin component comes with different flexible sizes, which can be used as -

• mar-xs
• mar-sm
• mar-md
• mar-lg
• mar-xl
• mar-xxl