Forum Discussion

JoyceMaurin-e58's avatar
JoyceMaurin-e58
Community Member
5 years ago

Change button text colour

Hello,

I try to personnalize a button using the "button" function in Rise and I'm unable to figure how to change the colour of the text in the button. I can change the background-color of the row, the background-color of the button but not the text-color of the button.

Is it possible? If yes, how?

I tried with firefox and Chrome, last versions.

Thanks for your help,

Rise 360
  • GrenForonda's avatar
    GrenForonda
    2 years ago
    Hi there!
     
    Good news! You can now use theme color contrast to make sure that text or icons that appear on top of a theme color meet contrast guidelines automatically.
     
    To use this new feature, simply go to the Theme tab, select Colors and choose one of the following options:
    • Auto: Turns text and meaningful graphics to black or white automatically depending on your accent color to meet the minimum accessibility contrast requirements.
    • Dark: Turns text and meaningful graphics to black.
    • Light: Turns text and meaningful graphics to white.

    Once you’ve given it a try, we’d love to hear what you think!
  • AmandaDavila's avatar
    AmandaDavila
    Community Member
    2 years ago

    I've submitted a feature request as well. This is a huge issue for us in developing our courses. 

  • MaryMontgome958's avatar
    MaryMontgome958
    Community Member
    4 years ago

    Has this been updated? I don't see a way to change the color of button text but this is something that would be very helpful for accessibility. 

    Buttons in Rise with white text fail the WCAG color contrast at AA and AAA for normal and large text when it is white text on bright and even some dark colors.

    I have a whole theme designed and the color with black print that I am using passes all of the WCAG contrast standards but white text on the same color fails all of them. See the images attached, they are from the WebAIM Contrast Checker.

    Guess I should have started by checking the buttons. If I could change the button text to black it would pass and save me time that I now have to use to rework my design with a color that will pass. 

    Are there any other ways to make this work?

  • JulieTaylor-3a8's avatar
    JulieTaylor-3a8
    Community Member
    2 years ago

    I have logged a feature request for this to be amended as it is a huge oversight in good design development I feel. If you agree perhaps you would also add your weight to the situation and raise a feature request for this also! 

  • GrenForonda's avatar
    GrenForonda
    Staff
    2 years ago
    Hi there!
     
    Good news! You can now use theme color contrast to make sure that text or icons that appear on top of a theme color meet contrast guidelines automatically.
     
    To use this new feature, simply go to the Theme tab, select Colors and choose one of the following options:
    • Auto: Turns text and meaningful graphics to black or white automatically depending on your accent color to meet the minimum accessibility contrast requirements.
    • Dark: Turns text and meaningful graphics to black.
    • Light: Turns text and meaningful graphics to white.

    Once you’ve given it a try, we’d love to hear what you think!
    • RichardBradl368's avatar
      RichardBradl368
      Community Member
      2 years ago

      Dear Gren,

      Our corporate colour is #F5F1E9, even setting to 'dark' doesn't help which makes this feature unusable - can something be done please?

      Kind regards,

       

      Richard

      • GrenForonda's avatar
        GrenForonda
        Staff
        2 years ago

        Hi Richard!

        Thanks for sharing these details. Sorry to hear that setting the Theme Color and the contrast to Dark doesn't seem to work on your end.

        I tried using #F5F1E9 as the theme Color, and set the contrast to Dark. The screenshot below shows the light color in sand/beige and the Dark (black) text color.

        Do you get a different result when using this color and contrast? Can you share some screenshots showing these settings on your end so we may investigate further? Thank you!

  • MeganBarrett-3c's avatar
    MeganBarrett-3c
    Community Member
    2 years ago

    I'm experiencing the opposite problem to white text on a button! I want the text to be white, and previously in this course it has displayed as white. Now it has somehow switched to black and I have no idea what is going on. The text in other elements such as the Continue button is still displaying as white within the same course. I've checked for any settings in the Theme and have tried each of the Auto, Dark and Light settings, with no luck. I am stumped....any ideas? 

    • hazelB's avatar
      hazelB
      Staff
      2 years ago

      Hi Megan! Thanks for sharing the screenshot. Are you still encountering this? 

      • Please make sure your browser is updated
      • Try other supported browsers, do you encounter the same issue?

      If this is still happening, please open a case with us here so that one of our technical support engineers can help you troubleshoot. 

    • SteveBrimley1's avatar
      SteveBrimley1
      Community Member
      2 years ago

      I get the same problem. It happens on both Edge and Chrome.

  • AlyssaGomez's avatar
    AlyssaGomez
    Staff
    5 years ago

    Hi Joyce, great question!

    The button text color in a Button Block is always white, but you can change the color of the button itself. 

  • AlyssaGomez's avatar
    AlyssaGomez
    Staff
    4 years ago

    Hi Mary!

    I can understand how white text on a button would be an accessibility issue, especially depending on the button's color. While there isn't a way to change the button text color or formatting right now, I will certainly bring this up with our Product team. I'll send you an update if we make adjustments that will help you!

Related Content