Product update: Announcing Instant CSS

At Instant Commerce we’ve built the largest library of pre-built conversion optimized eCommerce blocks. With the goal to help you create the best possible headless webshop in an easy and fast way.

Until now, customization of these blocks was possible with our no-code tools. While this offered the flexibility to build great stores, we decided to go one step further.

Announcing: Instant CSS. With Instant CSS every block becomes customizable to the pixel. Read on to find out how it works.

Step 1: Build your store

First things first, build the store you've always dreamed of by selecting and customizing our pre-built eCommerce blocks.

Step 2: Head into the CSS editor 

Now that you have built your store, it's time to add an extra level of customization to various parts of your store. Head over to the 'Custom code' dashboard and click on 'Add CSS Snippet' to enter the CSS editor.

Step 3: Add custom CSS

Go to the page that needs customization, add your CSS code and get a live preview of the changes you make.

The code editor includes syntax validation and auto-completion.

Important: Only use the human-readable class names, don't use the generated hashed classes (more docs coming soon).

Step 4: Publish the changes

Hit save to automatically sync the changes to your headless CMS. When you go back to the 'Custom Code' dashboard you get a clear overview of the different CSS snippets you created.

Fun fact, we implemented the Monaco Editor, also used by VS code.

Happy customization!