Custom CSS

For shared collections, we allow you to customize pretty much everything by bringing your own CSS. This is mostly for developers, but we've seen non-developers make small customizations as well.

In the collection settings, go and create a new style tag.

Document image

To find out what to write in there, open your developer console on a shared collection, and focus the element you want to customize. Here's an example.

Document image

If the element or one of its parents has a class starting with ab- you can target that class in your style tag above.

If the element you are trying to style does not have a class starting with ab- it's because we don't allow customization for it. It's mostly to protect you from yourself. Sometimes if you have a good case for it and you tell us, we might make it happen.

Every element and block in the content also has a similar class to it.

Be careful and check what you're doing in dark mode. Dark mode adds a dark class at the top of the html tree. You can use that to target dark mode styles.

Examples

For example, this is how you change text to red in dark mode:

HTML