D
D
DeniSidorenko2017-10-23 20:25:08
SVG
DeniSidorenko, 2017-10-23 20:25:08

How to add shadow for such SVG?

hello, I'm importing svg. Has this code

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
   width="30.728px" height="40.728px" viewBox="0 0 12.728 22.728" enable-background="new 0 0 12.728 22.728" xml:space="preserve">
<path fill="#c1c1c1" fill-rule="evenodd" clip-rule="evenodd" d="M12.728,11.414L1.414,22.728L0,21.314l9.95-9.95L0,1.414L1.414,0l11.314,11.314
  l-0.05,0.05L12.728,11.414z"/>
</svg>

Tell me how to add a shadow here.
This is what the figure looks like:
b3a766f414.jpg

Answer the question

In order to leave comments, you need to log in

1 answer(s)
E
Eugene, 2017-10-24
@eGenius18

through the filter:

<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-50 -50 200 200">
  <title>svg arrow with dropshadow</title>
  <desc>An svg example of an arrow shape with a dropshadow filter applied. The dropshadow filter effect uses feGaussianBlur, feOffset and feMerge.</desc>
  <defs>
    <filter id="dropshadow" height="130%">
      <feGaussianBlur in="SourceAlpha" stdDeviation="3"/> 
      <feOffset dx="2" dy="2" result="offsetblur"/> 
      <feMerge> 
        <feMergeNode/>
        <feMergeNode in="SourceGraphic"/> 
      </feMerge>
    </filter>
  </defs>
  <polygon points="58.263,0.056 100,41.85 58.263,83.641 30.662,83.641 62.438,51.866 0,51.866 0,31.611 62.213,31.611 30.605,0 58.263,0.056" fill="#EEEEEE" filter="url(#dropshadow)"/>
</svg>

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question