"cut strawberry"
Bootstrap 4.0.0 Snippet by Shakibur22

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<svg version="1.1" class="straberry" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 600 600" style="enable-background:new 0 0 600 600;" xml:space="preserve">
<g id="leaves">
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="300.202" y1="364.4512" x2="300.202" y2="340.9279">
<stop offset="2.590880e-03" style="stop-color:#83E29F"/>
<stop offset="1" style="stop-color:#00A870"/>
</linearGradient>
<path class="stra0" d="M339.7,345.7c-23-9.1-35.8-2.7-38.7-0.9c-0.9-1.9-1.7-3.1-1.7-3.1c-0.6,1-1.2,2-1.7,3
c-7.2-1.7-28.6-6-36.9,1.1c0,0,3.6,7,22.1,4c-2.7,1.7-4.7,4.3-4.9,8.3c0,0,9,4.7,17.5-7.9c-2.8,10.2,3.8,14.3,3.8,14.3
c5.4-3.4,5.4-9.2,4-14.1c8.5,12.4,17.4,7.7,17.4,7.7c-0.2-3.9-2.1-6.5-4.7-8.2C332.8,352.7,339.7,345.7,339.7,345.7z"/>
</g>
<g id="Knife-behind">
<path class="stra6" d="M447.6,247.6c-145.6-3.5-283.4-68-283.4-68s34.6-5.2,46.2-6c59.2-3.8,237.1-3,237.1-3V247.6z"/>
<path class="stra7" d="M442.7,247.2c-145.6-3.5-278.5-67.6-278.5-67.6s34.6-5.2,46.2-6c41.8,12.1,79.3,28,106,32.3
c57.2,9.2,119.4,13.2,119.4,13.2L442.7,247.2z"/>
<path class="stra8" d="M447.6,247.6c-145.6-3.5-283.4-68-283.4-68s42.6,16.7,53.7,20.4c40.4,13.3,62.3,19.4,88.6,26
c25.2,6.3,58.4,11.7,72.5,13.7c45,6.5,68.5,5.9,68.5,5.9L447.6,247.6z"/>
<path class="stra9" d="M504,166.4l-39-0.2h-17c-2.9,0-5.3,2.4-5.3,5.3v75.7c0,2.9,2.4,5.3,5.3,5.3h17c11.9-25.7,39-26,39-26v0h21.1
c2.3,0,4.6-0.6,6.6-1.8l5.5-3.2c4.2-2.5,9.4-2.4,13.6,0.2l0.7,0.4c4.3,2.7,9.7,2.7,13.9,0c4.5-2.8,10.2-2.6,14.6,0.4l2.1,1.5
c2.2,1.6,4.9,2.4,7.6,2.4h12.5v-60H504z"/>
<linearGradient id="stain_1_" gradientUnits="userSpaceOnUse" x1="265.8091" y1="221.7616" x2="340.2461" y2="221.7616">
<stop offset="1.295440e-03" style="stop-color:#E0023C"/>
<stop offset="0.8381" style="stop-color:#FF2156"/>
<stop offset="1" style="stop-color:#FF487B"/>
</linearGradient>
<path id="stain" d="M266.3,216c0,0,51.6,16.8,72.6,18.5c0,0,3-2.6,0-4.3s-10.2-2.5-11-6.4s-5.8-8-9.7-7.6
c-3.9,0.4-6.5,2.8-16.9-1c-3.2-1.2,4.6-5.6-3.2-5.1c-5.6,0.3-6.4-2.8-15.7,1.1c-7,2.9-11.8,0.6-14.8,1.1
C264.6,212.5,266.3,216,266.3,216z"/>
</g>
<g id="straw4">
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
.straberry{background-color: #ffce88;}
.stra0{fill:url(#SVGID_1_);}
.stra1{fill:url(#SVGID_2_);}
.stra2{fill:#FFFFFF;}
.stra3{opacity:0.5;fill:#FFFFFF;}
.stra4{opacity:0.93;fill:#FFFFFF;}
.stra5{opacity:0.8;fill:#FFFFFF;}
.stra6{fill:#DDDDDD;}
.stra7{fill:#EEEEEE;}
.stra8{fill:#A6A6A6;}
.stra9{fill:#1A1A1A;}
.stra10{fill:#FF5282;stroke:url(#SVGID_3_);stroke-miterlimit:10;}
.stra11{fill:#FFCBD7;}
.stra12{fill:#FF84A3;}
.stra13{fill:#FFCFE6;}
.stra14{fill:#FF487B;}
.stra15{fill:#FF5282;stroke:url(#SVGID_4_);stroke-miterlimit:10;}
.stra16{fill:url(#SVGID_5_);}
.stra17{fill:#FF5282;}
.stra18{clip-path:url(#SVGID_7_);}
.stra19{fill:url(#SVGID_8_);}
#stain{
fill:#FF5282;stroke:url(#SVGID_3_);stroke-miterlimit:10;
opacity:0.3;
}
#Knife-behind{
animation: cutb 2.8s ease infinite;
}
#Knife-front{
animation: cutf 2.8s ease infinite;
}
@keyframes cutb{
0%{
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: