How do I adjust accordion heading colors for all pages?

Annette.P.996 Posts: 7 🌱

We use the Brightspace HTML Template v3, and I would like to change the colors of the H2 and H3 headings on accordion elements for all pages. Am I on the right track thinking I need to update one (or more) of the CSS files in our Public Files (shared‎/HTML-Template-Library‎/HTML-Templates-V3‎ _assets‎/css)? I’ve had far more experience with HTML than CSS, so I’m making sure I start in the correct place. Plus, there are a few more CSS edits that I would like to make around that same time. (After any edits, I’ll try them out on the Test Site first to make sure I don’t break anything on our live site.)


Best Answers

  • Prithvi.A.303
    Prithvi.A.303 Posts: 40
    Answer ✓

    Hello @Annette.P.996

    Thank you for contacting us via Brightspace Community!

    May I suggest you to open a support ticket with us for us to further investigate this issue please?

    Kind Regards,


  • Jennifer.W.973
    Jennifer.W.973 Posts: 242 🌟
    Answer ✓

    @Annette.P.996 Are you referring to the accordion titles that are clicked on to open the panels? Those are h2 in the HTML but the rendered code actually turns those into buttons. You would need to edit this code with your own hex code for the new color in the styles.min.css file. (Or you can put this code in the custom.css file if you don't want to risk changing anything in the main CSS file.)

    .accordion .card .card-title button {
    color: #535054;