How to Use SLDS Icons/SVGs in Visual Force Pages

To use Icons/Svgs in visual force pages below 2 steps is required

• Include latest slds styles   <apex:slds />

• apply use property in svg tag with required icon

       <use xmlns:xlink="http://www.w3.org/1999/xlink" 

           xlink:href="/apexpages/slds/latest/assets/icons/standard-sprite/svg/symbols.svg#call" />
                

<apex:page standardController="Case" docType="html-5.0" id="pageId" showHeader="false" showChat="false" sidebar="false" lightningStylesheets="true">
    <apex:slds />
    <apex:form id="formId" >
        <div class="slds-truncate sldswordWrap" >
            <span class="slds-icon_container slds-icon-standard-call" title="Dial To Bo">
                <svg class="slds-icon" aria-hidden="true">
                    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/apexpages/slds/latest/assets/icons/standard-sprite/svg/symbols.svg#call" />
                </svg>
                <span class="slds-assistive-text">Description of icon when needed</span>
            </span>
        </div>
    </apex:form>
</apex:page>

Output:

Hope this helped you..Enjoy!..