Blocked choice of Theme (BS 5.1)

I created a new project by cloning SB Admin example, based on BS 5.1.
But I can’t change color by choice another Theme:

Why this is blocked?

I emailed support mentioning this, here’s their response.

Thank you for reaching out! If you create a new Blank design, the themes are unlocked so you are free to change them. You can also import a customized Bootstrap with entirely different defaults, and use it as a theme: Themes | Bootstrap Studio

If you need to change the colors you will need to edit all the CSS you want to change.

You can get the SB Admin theme css here:

Save it as a css file and then import it as a theme

Obrigado, você foi ajudar o amigo e acabou me ajudando também.

How to use this file? I import it as theme and what next?

I still have Theme blocked

This is ultra complicated.
That’s why I buy this kind of program so that I don’t have to manually change fundamental settings.
It’s like Photoshop doesn’t allow you to change the color of an object… misunderstanding.

It is not that complicated, If you want to change the color of the sidebar, add this to a CSS file and change the color on the background-image

.bg-gradient-primary {
    background-color: #4e73df;
    background-image: linear-gradient(180deg, #4e73df 10%, #224abe 100%);
    background-size: cover
}

here is an example (with a scrollToTop button)

@jac.las

You can download the bsdesign from the example above. It’s with the theme Sandstorm, but you can choose one from of your themes

Thanks for the template, in it I can change the theme… but that’s just one case, one template, what about more?
This should be simpler. Why isn’t there an option to globally change all the primary colors that BS uses? All those “primary”, “secondary”, “success”… etc.

Another question, how to change the class indicated by the arrow:

How change navbar-dark? I know where to change next class that is bg-primary, but navbar-dark I don’t know… it is hard to understand.

To edit the theme of your navbar, select the “navbar” in your overview panel, much easier to work with the elements that way.

Now check your top right tabs and click the Options one. This is where you will do most of your changing of settings for components.

Select the Background Dropdown and choose Dark.
Select the Text Color Dropdown and choose White (or whatever color you want there). Hope that helps!

It doesn’t change the class navbar-dark, just add another class. Also, I can’t change the font color on the navbar. This is a drama.
The lack of ease of changing colors disqualifies this tool for my needs :neutral_face:

You need to know HTML and CSS to use this tool productively. It’s not, nor does it say it is, a full drag and drop app. If you want to change navbar font colors other than to black/white, you’ll need to edit the CSS for that.

The steps I gave you will change the bar from light to dark & vs. vs. and the text as well. The nav-bar-light changes to navbar-dark when I change it to Dark in the Navbar Options settings. Maybe you’re not changing the right thing? Works correctly for me on Mac.

Other than that, you can change anything you want to whatever colors you want, but you still need to select the correct component part to do this which begs the need for some HTML and CSS knowledge.

In the SB Admin theme, the navbar-dark class isn’t really used. Unfortunatly it is locked into the theme even though it doesn’t do anything, if you want to adjust the background colour to something that isn’t one of the standard colours (primary, secondary, warning etc) then you can easily rewrite them in css

Something like:

.bg-primary {
  background-color: tomato!important;
}