Skip to Content
Modern

CSS

Framework
Create responsive websites using the most modern CSS techniques with our dynamic framework.
An advanced webdesigner toolbox
built with accessibility in mind
for your website performance
Intelligentsia vinyl XOXO
Mixtape est hashtag butcher adipisicing yr.
Gastropub health goth
 literally locavore. Clichex ullamco.
Leggings pork et belly
It man braid bicycle rights, raw denim .
Before they were sold out
Hashtag jianbing adaptogen brunch .
Powerful

BUILDER

Enhancements
Streamline your workflow and unleash your productivity with huge time savers in your buidler
The framework at your fingertips
thanks to smart context menus
and efficient custom elements
Padding
1
2
3
4
5
6
7
Margin
1
2
3
4
5
6
7
Width
1
2
3
4
5
6
7
Height
1
2
3
4
5
6
7
Fontsize
1
2
3
4
5
6
7
Weight
1
2
3
4
5
6
7
Lineheight
1
2
3
4
5
6
7
Letterspace
1
2
3
4
5
6
7

We love these Page Builders!

OxyProps is tailor made for these builders. It will detect which one is active on your site and load the corresponding assets.
OxyProps In Oxygen Builder screenshot in a computer frame

Meet OxyProps

The CSS Custom Properties & Utility Framework for your Site Builder

What they say about OxyProps

Read what people are saying about their experience with us and our product

A lot of value

This plugin deserves more than it was priced for. It's price does not reflect its value.

Ismail Kina
OxyProps User

I can't believe it

I can't believe how much you have packed into OxyProps for such a low price! And, as always, love the videos; always showcasing some tidbits I hadn't known about before. And love the creative build. It's nice to see something different! Thank you for all your hard work on OxyProps and producing these awesome videos to go with!

Jennifer
OxyProps User

OxyProps is absolutely unique

The functionality of OxyProps compared to other solutions is not a matter of debate, I have automatically replaced the other options with something far superior like OxyProps. But if, in addition, you are interested in beauty when working, complete harmony and every detail taken care of, OxyProps becomes absolutely unique. Aesthetics is something that greatly enhances work and makes life more pleasant, that captivated me. But it's often the case that when you have that level of attention to detail, it often comes with a similar technical quality. And if you're grateful that the developer himself comes to your site on a Friday night to fix a little problem that arose during an update, that's all there is to think about. OxyProps is a role model in many ways.

Leandro Ojeda
Owner
Artenweb

A tremendous time-saver

OxyProps is a game changer if you’re looking for an easy way to build scalable, responsive and future-proof websites. It’s also a tremendous time-saver thanks to the context menus along with on-the-fly previews. Talk about visual building! And it seems it’s just the beginning…
Make sure to watch Cedric’s YouTube videos — the learning curve is surprisingly short and as you’ll see, the sky’s the limit. Thank you Cedric, two enthusiastic thumbs up!

Alexei Kutsko
Owner
WP Speed Guru

My preferred framework

There are a lot of frameworks around lately and there is not one that can fit all needs, but if you care about support and the people behind the product, OxyProps is the main option in this moment. The developer is focusing in his product, listening to community and taking care of every part that he touch.
In this moment is my preferred framework.

Marco Rubiol
Cantautor
Marco Rubiol

There is no other better css framework

I don't have web development or web design agency and mainly have started to use OxyProps to design my own websites. I think for a beginner to design websites, it will take some time to learn OxyProps and official youtube channel has helped me a lot. But as soon as you learn how to use it you will realize there is no other better css framework than OxyProps for Oxygen and Bricks builder users. Although it has been developed lately but in a short period of time many unique features have been added and completely has surpassed other css frameworks for Oxygen / Bricks.
Although it has been named a CSS framework but it seems it has some features which have been developed using javascript.

Sharif Payenda
OxyProps User

Improves your workflow

Oxyprops is a real professional tool based on a useful framework. But Oxyprops goes much more beyond that thanks to the contextual menus that will so much fasten and improve your workflow. After testing it you will have hard time not having it. So much impressed.

Thibaut Goarant
Agency Owner
Agence Kokoro

Awesome stuff

Awesome stuff.

I think your product is going to be the best seller in the Oxygen community. It’s fantastic.

Super speed support

Seriously, thanks for looking into my problem "à la seconde"💛 for all your support at super speed and your constant effort 👍 amazing product, amazing developer (and team of your's)!!!

Petra Jovkov

Love it!

Absolutely love the plugin.

Rika Fouché
Business Owner
ERC Design

Dark mode made easy

Really amazing contributions to community sir… before this I was not even trying dark version or light version effect but from oxyprop is easy and fast

Shibu Pandit

I'm Excited

Die Entwicklung des Oxyprops-Frameworks geht mit großen Schritten nach vorne. Super!!!! Ich bin begeistert.

The development of the Oxyprops framework is making great strides. Great!!!! I'm excited.

Marco N

A well thought through system

This is a really nice system and it is well thought through. Darkmode with a lot of variations seems so easy now. Wonderful, thanks a lot for expanding OxyProps with such good benefits!

Ingo Wo

An amazing plugin

Looks like an amazing plugin, it takes oxygen builder to the next level.

Keleher Kevin

I'm loving more and more each day

Just bought my copy of Oxyprops, even though I have been using Oxyninja. Good stuff. I was gutted to miss out on automatic css ltd. But this Oxyprops seems equally capable for my needs. Am super glad I stumbled upon this. Now a tool i'm loving more and more each day. Your videos are very useful in helping me learn about both Oxygen Builder and Oxyprops. Keep them coming, Mister! You're a good presenter and even better teacher.

Learn More Earn More
OxyProps User

Love

I love OxyProps 🥰 ! We are waiting for a more or less definitive version to make a new review on our website for oxygen spanish speakers users. Oxyprops is moving very fast. In fact we are thinking of making an exclusive section dedicated to Oxyprops. In the link below we have a slight introduction of the previous version.

Juan Jose Gonzalez
Lead of Oxygenados community
Oxygenados

Oxyprops takes CSS to a new level

Our conclusion after having tried OxyProps is that this plugin CANNOT be missing from your arsenal, in any way, we consider it essential and as we have already said, the combination remember - hydrogen - Oxyprops is the💣

Oxygena Dos
Spanish Oxygen Builder community
La Comunidad

Save time, save money!

OxyProps will help you save time in your process.
This means more time you can dedicate to value added activities billed to your clients.
Check if your time is worth the investment :
Cheaper than a coffee!
Less than 0.21€ per workday !
(based on agency lifetime plan, 20 workdays per month, 2years of use)

Your Inputs

Your hourly rate:

€/h

Your building workhours:

h/day

Your ROI

Wow! Your investment in OxyProps will break-even when you save as little as:

seconds/workday

Your Savings

Let's assume you will save only 1 minute of your precious time per working hour thanks to OxyProps. This is a recurring saving of:

€/year

Start Building Today!

Choose the plan that is right for you and start building awesome Websites with OxyProps
lifetime
yearly
OxyProps Personal
Lifetime
    ONE Website
    For Oxygen builder
    For Bricks builder
    Lifetime Updates
    Lifetime Support
    One time payment
49 €
buy now
OxyProps Agency
Lifetime
    UNLIMITED Websites
    For Oxygen builder
    For Bricks builder
    Lifetime Updates
    Lifetime Support
    One time payment
99 €
buy now
OxyProps Pro
Lifetime
    FIVE Websites
    For Oxygen builder
    For Bricks builder
    Lifetime Updates
    Lifetime Support
    One time payment
69 €
buy now
OxyProps Personal
Yearly
    ONE Website
    For Oxygen builder
    For Bricks builder
    1 Year of Updates
    1 Year of Support
    Yearly payment
29 €/year
subscribe now
OxyProps Agency
Yearly
    UNLIMITED Websites
    For Oxygen builder
    For Bricks builder
    1 Year of Updates
    1 Year of Support
    Yearly payment
49 €/year
subscribe now
OxyProps Pro
Yearly
    FIVE Websites
    For Oxygen builder
    For Bricks builder
    1 Year of Updates
    1 Year of Support
    Yearly payment
39 €/year
Subscribe now

Why is OxyProps the best match for you ?

Wether you're a business owner building your first website, or an experienced Websites Developer looking for efficiency and time savings, OxyProps has your back.
01

A Powerful Color System

Oxyprops makes managing your website colors and color schemes a piece of cake.
From your plugin dashboard, select pre-built color swatches or define your custom ones.
When you design, simply use OxyProps logical colors (also made available as global colors). Your design will automatically respond to light & dark, or any color scheme you choose.
02

Less typing, props are available with a simple click

Have you ever tried to use custom properties but got stuck searching endlessly for the correct syntax, or loosing time typing and typing again the prop name in value fields ?
Forget about it! OxyProps smart context menu makes relevant props for a specific field available with a simple click .
03

Build light and  dark versions of your site simultaneously

When you use OxyProps logical colors, your site is light/dark responsive "out of the box"
OxyProps adds a light/dark toggle to your builder UI so you can always easily make sure your design looks good in both versions.
04

Classes navigation and live preview

You don't remember the exact class, or you are not sure which one to use?
OxyProps improves your builder classes list navigation with keyboard navigation and live preview of the class effect.
05

Rely on OxyProps Default Settings

Do you need to be up and running fast for your new website project ? Then leverage OxyProps default Global Settings.
When activated, OxyProps will redefine your builder global settings using OxyProps Custom Properties for every setting from fonts stacks through fluid typography to colors and spacing.
You get a fully responsive settings blueprint that you can tweak to your liking.
OxyProps Screenshot showing default settings applied to Oxygen Global Settings
:where (figure) {
display: grid;
gap: var(--o-size-2);
place-items: center;
}

:where(figure) > :where(figcaption) {
font-size: var(--o-font-size-1);
}
06

No need to fight the framework

Did you ever use a CSS framework, and then spent hours trying to style an element fighting against the framework defaults built with extreme specificity or even !important rules?
OxyProps is built with Zero Specifity Rules so you can always easily apply your custom styles at a local level.

OxyProps covers all design aspects

The range of properties and utility classes offered by OxyProps is wide and will grow further with future versions.

Colors

As OxyProx is built on top of Open Props , it also includes Open Color, an open-source color scheme optimized for UI development.
Preview »

Colors Schemes

OxyProx Automatically Adapts to your website visitor Light or Dark  preference.
Enjoy our schemes switcher.
Preview »

Layouts

Our layout props and classes will help you design your prefered layout in no time.
Most of them are built to be naturally responsive!
Preview »

Gradients

OxyProps Gradients can be used as background or text gradients.
Combine them with noise and filters for enhanced visual effects.
Preview »

Shadows

A selection of Inner and outer box shadows of several strengths to bring depth in your designs.
And they adapt to light and dark modes!
Preview »

Aspect Ratios

Easily give an element the aspect you wish without messing with heights.
Available with or without object-fit: cover.
Preview »

Typography

A helpful set of props to style your texts. Fluid and static font sizes, leading and tracking, text orientations, and other typography properties, all ready to use.
Preview »

Easing

You will find the familiar ease, ease-out, ease-in, and ease-in-out timing functions available in 5 strengths. But also extra easings that mimic physics!
Preview »

Animations

Get premade keyframe effects to use as is or combined in your own animations.
OxyProps utility classes allow you to target normal, active and hover states.
Preview »

Sizes

No px here, relative units all the way.
Available as fixed of fluid sizes.
Preview »

Borders

Everything you can need to style borders : width, corner radius,  round radius, conditional radius, and a selection of blobs.
Preview »

Z-index

Take control over the third dimension with Layers props and classes that bring all the z-index values you could possibly need!
Preview »

Media Queries

Currently ahead of the CSS spec, Open Props brings to OxyProps  named media queries with the @custom-media syntax. Not yet supported by browsers but ready for the future of CSS!
Preview »

Buttons

OxyProps includes utility classes to convert your Oxygen text links to button.
Combine them with colour props and animation props for awesome visual effects.
Preview »

Cards

2 sets of cards utility classes matching your colour theme using surfaces and shadows to add depth to your design.
Solid cards, like this one, and glass cards for a glassmorphism effect.
Preview »

Want to know more ?

And why wouldn't you ? Here are additional informations to help you clearly understand OxyProps.

What is OxyProps ?

OxyProps is a WordPress plugin that adds a CSS custom properties collection, a Utility Classes Framework, Custom Components, and Builder features for lightning fast access to the custom properties. It allows you to build consistent design, use light, dark and colour schemes, and save time in your development process.

What OxyProps is NOT ?

OxyProps is not a pre built design set. You will not get a library of sections, pages, headers and other blocks. OxyProps is also not a builder UI enhancer, except for the context menu which is there to give you instant access to the props in oxygen value fields, and the light/dark toggle which allows you to build both modes simultaneously. In. Oxygen, we like to use OxyProps together with Recoda Workspace for the perfect combo.

Which page builders are compatible with OxyProps ?

Oxygen Builder & Bricks Builder are supported.

To make OxyProps compatible with a page builder, three main things must happen:

  1. The CSS code must be modified to adapt to the builder specific way to output code
  2. A builder specific "in-builder app" must be developed
  3. The custom elements must be converted to the new builder elements API

If points 2 and 3 are 100% builder specific, a large part of the CSS framework will work with. any builder that accepts CSS variables and classes.

Do I need Oxygen or Bricks to use OxyProps

Yes you do. Even if you can access the props and utility classes loaded by OxyProps in any WordPress environment, the integration features only work inside the supported Builders, and the props and framework CSS has been carefully designed for Oxygen and Bricks way to output code.

Will other builders be supported in the future ?

Many users did ask, so the Breakdance version of OxyProps is currently under evaluation. No promise it will ever be done, and of course no ETA! The vast majority of the framework already works well with Breakdance. Light and dark modes are also supported. Check BreakdanceProps.com.

There is currently no plan to port OxyProps to other page builders. That being said, it depends on the community. So, we may consider supporting other builders one day. You can suggest your favorite one on OxyProps Feedback Site.

You say OxyProps is built with Open Props. What is Open Props ?

Thanks for that very good question ! Open Props is an Open Source collection of web design tokens in the form of CSS Custom Properties. You can access Open Props repository on GitHub. OxyProps uses Open Props and extends it with additional custom props and a utility classes framework using the props.

If Open Props is Open Source, why should I purchase OxyProps ?

Even if you choose not to purchase OxyProps, we strongly encourage you to give Open Props a try. OxyProps was build from our extensive usage of Open Props in Oxygen since it was released in november 2021. Oxyprops adds additional props to extend the core set, a large utility classes library built on the prop collection, Oxygen AddOns to make the props available right in Oxygen Builder, and will first save you hours of troubleshooting, and the hours of searching and typing.
Didn't find your answer ? Still have questions ?
Contact-us