Add icons to this collection by clicking the heart icon.
Hairpin icon - also known as pin, fashion, beauty, accessory, hair salon, hairstyle, Hairpin, and hair pins. Created in a clean gradient style, perfect for web, apps, and UI projects. Available in SVG and PNG, with multiple style variants.
<svg
xmlns="http://www.w3.org/2000/svg"
width="512"
height="512"
viewBox="0 0 512 512"
>
<linearGradient id="a">
<stop offset="0" stop-color="#ff2f2b" />
<stop offset="1" stop-color="#ff9ceb" />
</linearGradient>
<linearGradient
id="d"
x1="74.98"
x2="437.018"
y1="437.019"
y2="74.98"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<radialGradient
id="e"
cx="348.281"
cy="164.732"
r="388.054"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ff2f2b" />
<stop offset=".015" stop-color="#ff3436" stop-opacity=".985" />
<stop offset=".071" stop-color="#ff445c" stop-opacity=".929" />
<stop offset=".135" stop-color="#ff527d" stop-opacity=".865" />
<stop offset=".204" stop-color="#ff5e99" stop-opacity=".796" />
<stop offset=".282" stop-color="#ff67b0" stop-opacity=".718" />
<stop offset=".372" stop-color="#ff6fc1" stop-opacity=".628" />
<stop offset=".481" stop-color="#ff74cd" stop-opacity=".519" />
<stop offset=".63" stop-color="#ff77d4" stop-opacity=".37" />
<stop offset="1" stop-color="#ff78d6" stop-opacity="0" />
</radialGradient>
<linearGradient id="b">
<stop offset="0" stop-color="#ff70a9" />
<stop offset=".026" stop-color="#ff73ab" />
<stop offset=".686" stop-color="#ffb0d3" />
<stop offset="1" stop-color="#ffc8e3" />
</linearGradient>
<linearGradient
id="f"
x1="1090.37"
x2="1090.37"
y1="611.71"
y2="-506.454"
gradientTransform="rotate(45 255.843 -968.12)"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="g"
x1="1152.627"
x2="1152.627"
y1="659.595"
y2="-458.573"
gradientTransform="rotate(45 255.843 -968.12)"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="h"
x1="1121.499"
x2="1121.499"
y1="709.479"
y2="-247.523"
gradientTransform="rotate(45 255.843 -968.12)"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient id="c">
<stop offset="0" stop-color="#ffa9d7" />
<stop offset=".295" stop-color="#ffc6e5" />
<stop offset=".76" stop-color="#ffeff8" />
<stop offset="1" stop-color="#fff" />
</linearGradient>
<linearGradient
id="i"
x1="1121.499"
x2="1121.499"
y1="246.001"
y2="-333.825"
gradientTransform="rotate(45 255.843 -968.12)"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="j"
x1="54.906"
x2="589.608"
y1="457.094"
y2="-77.608"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="k"
x1="256.617"
x2="476.984"
y1="255.382"
y2="35.015"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="l"
x1="307.425"
x2="455.126"
y1="204.578"
y2="56.878"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<circle cx="256" cy="256" r="256" fill="url(#d)" />
<circle cx="256" cy="256" r="256" fill="url(#e)" />
<path
fill="url(#f)"
d="M133.486 312.937a24666.73 24666.73 0 0 1-49.498 48.907c-5.782 5.692-5.448 15.163.689 21.24 6.139 6.075 15.719 6.426 21.462.705a71566.491 71566.491 0 0 0 49.264-49.067c-7.301-7.279-14.61-14.544-21.917-21.785z"
/>
<path
fill="url(#g)"
d="M177.278 356.597a73891.634 73891.634 0 0 0-49.067 49.264c-5.721 5.743-5.369 15.324.705 21.462 6.074 6.137 15.549 6.471 21.24.689a24669.938 24669.938 0 0 1 48.907-49.498 10444.759 10444.759 0 0 0-21.785-21.917z"
/>
<path
fill="url(#h)"
d="M285.169 161.449a27471.912 27471.912 0 0 1-151.682 151.488c-5.929 5.871-5.79 15.467.276 21.493 6.067 6.025 15.738 6.18 21.64.292a79302.276 79302.276 0 0 0 82.517-82.384c6.006-6.004 15.739-6.006 21.743-.001 6.004 6.004 6.003 15.738-.001 21.743a81312.856 81312.856 0 0 0-82.384 82.517c-5.886 5.902-5.733 15.573.292 21.641 6.026 6.067 15.623 6.205 21.493.276a27437.187 27437.187 0 0 1 151.488-151.682 14343.052 14343.052 0 0 1-65.382-65.383z"
/>
<path
fill="url(#i)"
d="M396.852 225.214c9.365.062 16.894-7.32 16.775-16.495-.074-5.941 3.065-11.386 8.245-14.259 8.012-4.448 10.564-14.484 5.708-22.516-3.138-5.196-3.299-11.524-.445-16.562 4.416-7.782 1.302-17.975-6.865-22.837-5.284-3.139-8.656-8.736-8.87-14.678-.341-9.175-8.092-16.927-17.268-17.267-5.941-.215-11.54-3.585-14.677-8.87-4.862-8.168-15.052-11.281-22.836-6.865-5.038 2.854-11.366 2.692-16.562-.445-8.034-4.857-18.068-2.306-22.517 5.708-2.873 5.18-8.318 8.32-14.259 8.245-9.176-.119-16.556 7.413-16.495 16.775.044 6.056-3.102 11.628-8.271 14.631-7.984 4.645-10.72 15.018-6.053 23.142 3.021 5.257 3.046 11.721.046 16.961-4.637 8.102-1.862 18.481 6.24 23.182a17.074 17.074 0 0 1 8.498 14.704c.022 9.363 7.624 16.965 16.987 16.987a17.078 17.078 0 0 1 14.704 8.498c4.701 8.102 15.081 10.877 23.182 6.24 5.239-2.999 11.705-2.974 16.961.046 8.124 4.667 18.496 1.931 23.142-6.053 3.002-5.169 8.573-8.318 14.63-8.272z"
/>
<path
fill="url(#j)"
d="M410.981 163.25c.849 33.207-26.502 59.971-60.448 59.878-33.957-.144-61.515-27.706-61.661-61.661-.093-33.945 26.671-61.298 59.878-60.448 33.198.882 61.347 29.034 62.231 62.231z"
/>
<path
fill="url(#k)"
d="M395.717 162.902c.572 25.022-19.844 45.109-45.282 44.962-25.442-.171-46.128-20.857-46.299-46.299-.149-25.436 19.94-45.856 44.962-45.283 25.016.586 46.034 21.604 46.619 46.62z"
/>
<path
fill="url(#l)"
d="M365.428 177.539c-25.373-.334-46.081-21.074-46.38-46.487a47.518 47.518 0 0 1 .114-3.75c-9.284 8.293-15.125 20.553-15.026 34.263.17 25.442 20.857 46.128 46.299 46.299 24.166.147 43.801-18.004 45.198-41.261-7.939 6.936-18.529 11.1-30.205 10.936z"
/>
</svg>
More icons in the same style and category