How should I go about providing css options in my sites?

I recently started playing with Storyblok using Gridsome. I created a component in the editor and made a schema with a few fields to put in some css properties. In Vue I used a function to return a css object and bind it to the component inline. This all works great, however I understand the schema is intended for use with our site’s content, not for programmatic or styling purposes.

Ultimately I want to create custom components that give clients the ability to apply styling from the editor through custom options they don’t have to be a developer to understand. I’ve read the docs on plugins and tools but I’m still a little clueless as to what the difference is supposed to be between them. Would it be more appropriate for me to use one of those for the styling options? What would be the most appropriate way to go about doing this in Storyblok?

Hello Marc,

you have the choice but the easiest technique is to use a component that contains the settings that the editor should be able to use for settings different CSS options line inlining, background color, spacing, etc. For offering the different values usually option fields and also boolean fields are being used.

When you want to create your own field type that sits in your stories and saves this information then you can do that too as it is just another way. Here is an example:
https://app.storyblok.com/#!/me/plugins/134

Best regards
Hannes