I want to use a standard icon as button in my application but it is not allowed in lightning:buttonIcon.

If I use lightning:icon, it does not contain onclick handlers.

If I enclose it in div or any other html tag, I can't use event.getSource()/event.taget/event.currentTarget or any other event handler methods to get attribute value (like 'v.value') from that element because of locker service restrictions.

  1. Why are other types not allowed in lightning:buttonIcon?

  2. How to use standard icons in lightning:buttonIcon?

  • When we try to use Standard Icon, it gives an error as: lightning component 'buttonIcon' only support "utility" icons which answers your first question. Second question doesn't seems to be possible with lightning at the moment.
    – Raul
    Commented Dec 27, 2017 at 12:49
  • what is your use case?
    – Himanshu
    Commented Dec 27, 2017 at 12:57
  • @RahulSharma : I know it gives error and standard icons are not allowed. My question is why has salesforce have done that? It would be easier to use other icons as buttons had this restriction not been there.
    – Sarang
    Commented Dec 28, 2017 at 5:19

2 Answers 2


As Rahul said, lightning:buttonIcon supports utility:icons only. If you want to use Standard or Action icons then you can do as below.


<button name="lead" class="slds-button">
    <span data-value="{!value}" onclick="{!c.controllerFunction}">
          <lightning:icon iconName="standard:lead" size="small"/>

And you can get data-value like this. Controller:

controllerFunction: function(component,event,helper) {

   var value = event.currentTarget.getAttribute("data-value");

You can vote for this idea to request Salesforce.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .