Questions tagged [svg-icon]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
1
vote
1answer
53 views

How can I create a reusable lightning web component icon using a custom SVG file?

I want to create a reusable icon as a lightning web component. I found the following documentation: https://developer.salesforce.com/docs/component-library/documentation/lwc/lwc.use_svg_in_component ...
0
votes
0answers
98 views

SLDS icon not working in production but working in community and sandbox

I have a VF page which is sitting inside a managed package. This page displays a bunch of records and allows users to comment, edit and delete records. I have used SLDS icons to display my action ...
0
votes
1answer
342 views

Lightning Icon Background color not changing

I have a lightning icon in my lightning component. It is an icon of type standard and I want to change its color: Component <div class="slds-media__figure"> <lightning:icon iconName="...
0
votes
1answer
787 views

No COMPONENT named markup://svg found [duplicate]

After downloading the SLDS I have copied a detail form from the lightning design system to the salesforce console. But when I save there is a popup saying "No COMPONENT named markup://svg found". I ...
0
votes
0answers
99 views

Is it possible to use a custom SVG as icon for lightning card view component

Is it possible to use a custom SVG icon in a lightning card component: <lightning:card title="My card" iconName="custom_svg_here"> I have set a custom SVG icon for the custom lightning ...
0
votes
1answer
125 views

Access svg icon from static resource zip file

I have added zip file of lightning design system which contains fonts,icon,images,style folders. in this svg icons are in icons/utility-sprite/svg folder, i have set the path but it;s not reflecting ...
0
votes
1answer
302 views

Finding icon-names for Web Component lightning cards

In an example of creating a lightning web component, the html used a lightning-card tag. Within that tag, it declared a title and icon-name, where the icon pointed to custom:custom19 <template> ...
0
votes
1answer
365 views

how to add slds info icon in VF page? [duplicate]

In my VF page i have header .I want to display info icon before my text (before Note). Vf Code <div class="slds-page-header"> <apex:outputpanel rendered="{!isSuccess}"> <...
1
vote
2answers
260 views

SVG Polygon Shape in Lightning Component using SLDS

I created a Div using HTML/CSS to look like: Below is the Code: HTML: <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="styles.css"> </head&...
1
vote
1answer
366 views

SVG tags in Lightning Component

Is there a way to use SVG tags in lightning components? I would like to build and display about 6 SVG icons, but unable to use <svg> tag in the component. Is there any workaround for this?
8
votes
1answer
1k views

How to use slds illustration?

I looked into this to use illustration in my component. https://lightningdesignsystem.com/components/illustration/ As we can't use svg tag in lightning component, so is there any way by which we can ...
6
votes
1answer
4k views

Custom icons from static resource on <lightning:icon> not working

Trying to show custom icons from my static resource zip file using lightning:icon within a community, but it's not rendering the icons. It works for img tag, but I need to use fill to change the ...
0
votes
1answer
325 views

Adding SVG file to CloudPages

I'm trying to add an SVG file to a CloudPage in Marketing Cloud. Though the file type is enabled in our MC Account, SF support says we need to create an AMPscript in order to include these files. I ...
2
votes
1answer
1k views

Lightning button action in VF page

I have below commandbutton that works fine for me. When I try to convert to lightning buttons it simply just reloads the page and does nothing as expected like calling the pagereference method and ...
4
votes
3answers
581 views

Lightning Icons (SVG) not displaying in Lightning Out

For some reason lightning:icon is not displaying the svg in Lightning Out. I tried also lightning:buttonIcon and lightning:button with icon. Here is my ActivityTimeline (custom component) which uses ...
0
votes
1answer
239 views

<apex:slds /> against static resource

I'm using SLDS datepicker on my VF page. I tried <apex:slds /> at the first place to load utility-sprite event icon to click and load the calendar. But it didn't load properly. Then i switched ...
3
votes
2answers
2k views

How to use progress ring with lightning component

In recent release salesforce has released progress ring part of SLDS. https://www.lightningdesignsystem.com/components/progress-ring/#content I am little confused on how to use this with lightning ...
8
votes
1answer
1k views

Dynamically Render Toast Message With Icon?

I wrote a dynamic component to build toast messages based on ApexPages.Message in my answer here, but one aspect of it has been bothering me ever since, and I'm trying to fix it. When the toast is ...
0
votes
1answer
288 views

Custom SVG Icons in IE 11 inside Lightning Component not rendering

I know this has been asked a lot and with revamped extended IE 11 support for Lightning by Salesforce, the issue with SVG icons in Lightning Component arise again. I've been through the forum ...
0
votes
1answer
233 views

Lightning Icon 404 Not found

I copied this straight from Lightning Components Developer Guide and there is 404 error and I don't know why and how to fix it. <aura:handler name="init" value="{!this}" action="{!c....
2
votes
2answers
455 views

SVG Icon from Aura Bundle doesn't display in App Builder

So that my Lightning component displays nicely in the App Builder I added a .svg file to the bundle and copy & pasted the SVG from the Lightning Design System Icons. <?xml version="1.0" ...
6
votes
3answers
9k views

SLDS icon not appearing in visualforce page

Script 1: Does not Work <apex:page > <apex:stylesheet value="{!URLFOR($Resource.slds221, 'assets/styles/salesforce-lightning-design-system.min.css')}"/> <svg aria-hidden="true" ...
3
votes
2answers
13k views

lightning:icon not lightning:button with iconName attribute is not displaying

Tried in all browsers (IE, Chrome, Firefox) - but the icon is not displayed and I'm getting the following error message in the console: Unknown token "lightning.utilitySprite" default value was ...
6
votes
2answers
1k views

SVG Icons not displaying in Spring '17 pre-release environment

I'm seeing SVG icons not rendering in a Spring '17 environment. I'm using custom SVG lightning component from SLDS framework. The icons in my component continue to display correctly in existing Winter ...
2
votes
1answer
1k views

How can I use custom svg icons in a lightning component?

I have svg icons uploaded as static resource. How can I use these icons in a lightning component?
1
vote
1answer
141 views

Lightning ltng:require in svg

In my Lightning Component, I have the following SVG file for a logo to be shown on the community builder page (when you install a Lightning Component). //ComponentName.svg <?xml version="1.0" ...
1
vote
1answer
263 views

svgIcon doesn't work, url throws 404

I am new to SForce lightning, i have added svgIcon component as described by the link: https://www.lightningdesignsystem.com/resources/lightning-svg-icon-component-helper/ But when i try: <c:...
5
votes
1answer
128 views

Does Salesforce Locker Service has full support for svg?

I am working on enabling locker service for our org and we are using progressbar.js to render some of the metrics. However, I find that the progressbar.js throws up errors when locker service is ...
0
votes
2answers
1k views

Lightning Design System SVG Path Issues

I am trying to display an icon in a lightning component using LDS. I setup the svg helper, component, and renderer as per the LDS docs here. I also have a static resource stored in SalesForce. I am ...
1
vote
1answer
815 views

SVG Icon not displaying in IE11

SVG icon is not displaying in IE 11 but working in other browsers. I tried to set absolute path for svg but still not working. Updated with below code but still not working. <apex:includeScript ...
2
votes
2answers
875 views

Icon color <svgIcon> helper component (Community Lightning)

I'm using the helper component suggested on the Lightning Design System Icon documentation page for adding icons to Community components. I'd like to change the color of the icon, and not use a ...
0
votes
1answer
425 views

Don't understand the usage of <c:svgIcon> helper (Lightning Design System - Communities)

I'm trying to use different icons included in the icon package on the lightning design system. I'm rendering them inside a lightning component that is available in the Community Builder tool. I'm a ...
9
votes
3answers
19k views

Lightning : Icon color is not changing using the fill CSS

According to the documentation (https://www.lightningdesignsystem.com/components/icons/ ) we can change the icon color by suing the CSS. I am not able to do it. It always overrides with the Salesforce ...
2
votes
1answer
655 views

How to get SVG image coordinates in Lightning

I am displaying SVG image in Lightning, when I click on particular part in image I need to get co ordinates of that SVG image. Please help me to achieve this.
3
votes
3answers
1k views

Lightning design system - SVG disappears after rerender

I am building data table, here is html code from browser before rerendering table. I use actionFunction with rerender attribute. The problem is that svg disappears after rerendering. Before rerender: ...
0
votes
1answer
639 views

Salesforce custom SVG component showing background of icon but not image

I'm using this page to create my custom SVG component. However, the image background is showing up but not the icon inside the image. The SVG component is the exact same as on the page. I tried ...
4
votes
1answer
847 views

Are SLDS icons available natively in LEX?

According to this page on the Lightning Design System, the unmanaged package has been deprecated due to SLDS being available in Salesforce without need for a static resource. However, I'm having ...
2
votes
1answer
335 views

Lightning Component innerHTML fails without any error

I've been using the SVG component from the related Trailhead Module, and it doesn't display the icon with LockerService activated. I understand from this question that innerHTML is read only, thus ...
6
votes
2answers
2k views

How can we use custom SVG icons in Lightning Component with LockerService enabled?

I'm trying to use a custom SVG icon in a Lightning Component (not part of SLDS pre defined icons). I've put the SVG icon in following manner: MyTestApp.cmp <aura:component > <div aura:...