Introduction

OxyMade CSS Framework Introduction

OxyMade CSS Framework is based on Tailwind CSS utility classes. We love Tailwind and we think Tailwind is the future of CSS.

We have created an optimized Tailwind CSS experience to work with Oxygen builder. At first look our framework, just like Tailwind, might look over whelming for a few, but once you get used to it, you just write classes like you write css properties.

1. Structure:

Here is some information on how and where you can find more info about our framework:

  1. Our grid and responsive utilities are stored in a CSS stylesheet inside Oxygen stylesheets.

  2. Most of our utility classes like, paddings, margins, width, height, text sizes etc, are created as native Oxygen classes & all these classes are stored in OxyMadeFramework folder. We also add buttons, cards, icons, headings classes in the same folder.

  3. Our hover effects classes are stored in OxyMadeHoverStyles folder.

  4. We lock all our classes from accidental editing. If you want to edit our classes, you can unlock our classes right from the editor and modify them as you need.

2. Benefits:

Here are a few benefits of using OxyMade framework:

  1. Our framework is based on the most popular and trending CSS framework Tailwind.

  2. With a utility classes powered framework like ours, you don’t need to remember any class name at all.

    For ex: p is for padding, px is for padding-left & padding-right, py is for padding-top & padding-bottom, pt is for padding-top, pb is for padding-bottom, pl is for padding-left, pr is for padding-right

    And p-1 is a class name for padding: 4px; css property. In the same way, p-2 is for 8px padding, p-3 is for padding 12px. Also pb-1 is a class to apply padding-bottom: 4px; css property to an element.

  3. The framework is based on a proper & a popular 4px/8px spacing system. You can find every spacing class property can be divided by 4 to make it look uniform.

  4. We have a lot of responsive classes to quickly design for responsive screens as well. Just adding sm- in front of a class name makes it responsive for sm/mobile breakpoint.

  5. You are literally learning to write the best Tailwind CSS framework, which will be helpful for you and your career to design with HTML.

  6. A well maintained and most updated framework with over 600+ readymade classes.

  7. Unlike other frameworks, we don’t limit to any particular design system. You can literally create any type of website with complete freedom.

This post will be updated with more info as we develop it further.

← Add Sets to the Library
Install the plugin →