I want to have a help text with content but want to change the color of the icon in help text.

<lightning-helptext icon-name="utility:info"content="tooltip content here"></lightning-helptext>

In here I want to change the color of info icon. I have gone through icon-variant and its related style values. Lightning Web Component Help text

There is Customize Component Styling where it is written thatlightning-helptext contains the same customizable elements as lightning-button-icon for the button icon, which supports --sds-c-button-* custom properties.

<lightning-helptext icon-name="utility:info"  content="tooltip content here" class="icn"> </lightning-helptext>

    --sds-c-button-brand-color-background: #bb00ff;
    --sds-c-button-text-color: #f4f7f9;

There i no reflect in button icon color


Why ".icon13" if the class name is "icn"? Try with .icn{}

Also, the css modifier is not correct, it has an extra "brand".

Try this:

.icn {
   --sds-c-button-color-background: red;
   --sds-c-tooltip-text-color: blue;

Sorry, I cannot add comments.

Edit: added text color.

  • i want to change button and icon color of help text this helps me in change in button color but tries to change color through "--sds-c-icon-color-foreground-default: #A0CFEC;" but didn't apply any color in that hook styling Apr 20 at 4:44
  • I edited it and added the text color, check now. Apr 20 at 6:24
  • depends upon your changes as suggested lightning help text button background color gets changes but not icon-name="utility:info" which still have its default icon variant Apr 20 at 11:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.