We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to use glyphter svg icon in Button?

You can create image only button with svg icon by using imageclass property. Refer to the following steps to achieve this.

  1. First, refer to the glyphter.css file to the sample. Example, here it is referred with file name glyphter.css that is generated from the glyphter generator.

glyphter.css

 

  1. Then, you need to overwrite the font family. Here, sample is set as a font-family while generating the font. Refer to the following code example.

button.html

 

  1. Next, set the desired image to the button. For that we have to set the imageClass property as the image class that is generated from the gliphter generator. Add the font-family class with the custom icon’s image class. Refer to the following code example.

button.html

 

  1. Use the following styles to align the custom icon properly while using in button.

button.html

 

Output:
Article ID: Published Date: Last Revised Date: Platform: Control:
4250 03/09/2015 03/09/2015 JavaScript ejmButton
Tags:
Did you find this information helpful?
Add Comment
You must log in to leave a comment

Please sign in to access our KB

or the page will be automatically redirected to sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon