Icons
Icons classic
<svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor" role="img">
<path
d="M13.8 24c-.3 0-.7-.1-1-.3-.6-.5-.7-1.5-.2-2.1l6.7-8H1.5C.7 13.5 0 12.8 0 12s.7-1.5 1.5-1.5h17.8l-6.7-8c-.5-.6-.4-1.6.2-2.1.6-.5 1.6-.4 2.1.2L23.6 11c.1.1.2.2.2.3 0 0 0 .1.1.1 0 .1.1.2.1.3v.6c0 .1 0 .2-.1.3v.1c-.1.1-.1.2-.2.3L15 23.5c-.4.3-.8.5-1.2.5z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="none" role="img"
stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"> <path
d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path
d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M8.5 20.5c-.4 0-.8-.2-1.2-.5L.4 13.1c-.6-.6-.6-1.7 0-2.3s1.7-.6 2.3 0l5.8 5.8L21.2 3.9c.6-.6 1.7-.6 2.3 0 .6.6.6 1.7 0 2.3L9.7 20.1c-.3.3-.7.4-1.2.4z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M12 18.854a1.71 1.71 0 0 1-1.211-.502L.507 8.071A1.713 1.713 0 0 1 2.93 5.648l9.07 9.07 9.07-9.07a1.713 1.713 0 0 1 2.423 2.423L13.212 18.353a1.712 1.712 0 0 1-1.212.501z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M5.132 12.01c.001.438.169.877.504 1.211l10.296 10.268a1.715 1.715 0 0 0 2.42-2.427l-9.083-9.057 9.058-9.083A1.713 1.713 0 0 0 15.9.502L5.632 10.797a1.713 1.713 0 0 0-.5 1.213z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M18.854 12.01a1.711 1.711 0 0 1-.504 1.211L8.055 23.488a1.713 1.713 0 0 1-2.42-2.427l9.083-9.057L5.66 2.921A1.713 1.713 0 0 1 8.086.501l10.268 10.295c.334.337.501.775.5 1.214z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M22.1 24c-.5 0-1-.2-1.3-.6L12 14.6l-8.7 8.7c-.7.7-1.9.7-2.7 0s-.7-1.9 0-2.7L9.4 12 .6 3.2C-.1 2.5-.1 1.3.6.5s1.9-.7 2.7 0L12 9.3 20.7.6c.7-.7 1.9-.7 2.7 0s.7 1.9 0 2.7L14.7 12l8.7 8.7c.7.7.7 1.9 0 2.7-.3.4-.8.6-1.3.6z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M10.6 7.6c-1.6.8-3 2.1-4.4 4-.2.3-.2.4 0 .6.1.1.2.1.4-.2l.1-.1c.2-.2.3-.4.6-.7 1-1.2 1.5-1.7 2.3-2.1.7-.4 1.3.2 1.1.9 0 .2-.1.4-.2.7-.1.1-.1.2-.1.3-.3.7-.5 1.2-.9 2.4v.1c-.1.3-.1.3-.3.7-.6 1.5-.9 2.4-1.3 3.4v.1c-.1.3-.1.4-.2.5-.4 1.1-.7 1.9-.8 2.6 0 .1 0 .1-.1.2-.1.4-.2.7-.2 1-.1.5 0 .9.1 1.3.2.4.6.7 1 .7.7.1 1.4.1 2.1 0l1-.3c1-.4 1.9-.9 2.8-1.7.8-.7 1.5-1.5 2.3-2.4.1-.1.1-.1.1-.2.2-.3.4-.5.4-.7 0-.2-.1-.4-.3-.4-.1 0-.2.1-.3.3-.1.1-.1.2-.2.2l-.6.6c-.3.4-.7.7-1.2 1.3-.3.3-.6.5-.9.7-.6.3-1.1-.1-1-.7 0-.4.1-.8.3-1.3.3-.9.6-1.6 1.2-3.2.3-.7.4-1 .5-1.4.4-1.1.7-2 1.1-2.9.4-1.1.6-1.9.7-2.7.1-.6-.1-1.2-.5-1.6-.4-.5-1.1-.7-1.8-.7-.8 0-1.8.2-2.8.7zM16.5.2c-1.5-.6-3.4.4-3.7 2.1-.2 1.2.2 2.2 1.1 2.6 1.8.8 3.9-.5 3.9-2.5.1-1.1-.4-1.9-1.3-2.2z"></path>
</svg><svg viewBox="0 0 20 20" width="20" height="20" fill="currentColor"
role="img"> <path
d="M5.87.12C4.24.2 2.83.6 1.69 1.72A5.94 5.94 0 0 0 .1 5.9c-.05 1-.32 8.6.45 10.59a5.04 5.04 0 0 0 2.91 2.9 7.3 7.3 0 0 0 2.42.46c8.86.4 12.15.19 13.53-3.36.25-.63.42-1.35.46-2.41.4-8.88-.06-10.8-1.6-12.35C17.02.5 15.58-.32 5.86.13m.08 17.94a5.6 5.6 0 0 1-1.85-.34c-.88-.35-1.54-1-1.89-1.89-.59-1.51-.39-8.7-.34-9.86.05-1.14.29-2.18 1.09-2.99 1-.99 2.28-1.48 11.03-1.08 1.15.05 2.19.28 3 1.08.99 1 1.48 2.29 1.08 11.01-.04.97-.2 1.5-.34 1.84-.9 2.31-2.97 2.63-11.78 2.23M14.1 4.69a1.2 1.2 0 1 0 2.39 0 1.2 1.2 0 0 0-2.39 0m-9.23 5.3a5.1 5.1 0 1 0 10.2-.01 5.1 5.1 0 0 0-10.2 0m1.8 0a3.31 3.31 0 1 1 6.62.02 3.31 3.31 0 0 1-6.62-.01"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M24 24h-4.8v-8.4c0-2.3-1-3.6-2.8-3.6-2 0-3.2 1.3-3.2 3.6V24H8.4V8.4h4.8v1.8s1.5-2.6 4.9-2.6c3.4 0 5.9 2.1 5.9 6.4v10zM2.9 5.9A2.9 2.9 0 0 1 0 3c0-1.6 1.3-3 2.9-3 1.6 0 2.9 1.3 2.9 3 .1 1.6-1.3 2.9-2.9 2.9zM0 24h6V8.4H0V24z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M12.03.25a12.04 12.04 0 0 0-3.8 23.49c.6.1.8-.28.8-.6V21.1c-3.34.72-4.05-1.58-4.05-1.58a3.23 3.23 0 0 0-1.37-1.81c-1.1-.75.08-.72.08-.72.77.1 1.44.54 1.84 1.2a2.6 2.6 0 0 0 3.51 1c.05-.61.32-1.18.76-1.61-2.58-.27-5.45-1.3-5.45-5.89a4.7 4.7 0 0 1 1.2-3.26 4.3 4.3 0 0 1 .12-3.19s1.01-.33 3.31 1.2a11.6 11.6 0 0 1 6.02 0c2.3-1.55 3.31-1.2 3.31-1.2.44 1.01.49 2.14.12 3.18a4.62 4.62 0 0 1 1.2 3.26c0 4.6-2.82 5.61-5.51 5.91.59.59.89 1.4.83 2.23v3.3c0 .33.19.71.81.6A12.05 12.05 0 0 0 12.03.25z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="M14 24.1c-.3 0-.6-.2-.7-.5l-3.8-9-9-3.8c-.3-.1-.5-.4-.5-.7 0-.3.2-.6.5-.7L23 .1h.5c.1 0 .2.1.3.1l.1.1.1.1c.1.1.1.2.1.3v.5l-9.2 22.5c-.2.2-.5.4-.9.4zm-3-9.9 3 7 7-17-10 10zm-8.1-4.1 7 3 10-10-17 7z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path
d="m22.04 21.55-7.85-11.41-.89-1.29L7.68.69 7.21.02H.31l1.68 2.45 7.47 10.85.89 1.29 6 8.72.47.67h6.9l-1.68-2.45zm-4.4.89-6.23-9.06-.89-1.29L3.28 1.58h3.11l5.85 8.5.89 1.29 7.62 11.07h-3.11z"></path>
<path
d="m10.51 12.09.89 1.29-1.05 1.22L2.27 24H.28l9.18-10.68zM22.89.02l-8.71 10.12-1.05 1.23-.89-1.29 1.05-1.23 5.9-6.86L20.9.02z"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="none" role="img">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2"
d="M14 10v7m-4-7v7M6 6v11.8c0 1.12 0 1.68.22 2.1.19.38.5.7.87.88.43.22.99.22 2.1.22h5.61c1.12 0 1.68 0 2.1-.22a2 2 0 0 0 .88-.87c.22-.43.22-.99.22-2.1V6M6 6h2M6 6H4m4 0h8M8 6c0-.93 0-1.4.15-1.77a2 2 0 0 1 1.08-1.08C9.6 3 10.07 3 11 3h2c.93 0 1.4 0 1.77.15a2 2 0 0 1 1.08 1.08C16 4.6 16 5.07 16 6m0 0h2m0 0h2"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"
role="img"> <path stroke="currentColor" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2"
d="M6 12h6m0 0h6m-6 0v6m0-6V6"></path> </svg><svg viewBox="0 0 24 24"
width="24" height="24" fill="none" role="img"> <path stroke="currentColor"
stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M10 5H8.2c-1.12 0-1.68 0-2.1.22a2 2 0 0 0-.88.87C5 6.52 5 7.08 5 8.2v7.6c0 1.12 0 1.68.22 2.1.19.38.5.7.87.88.43.22.99.22 2.1.22h7.61c1.12 0 1.68 0 2.1-.22a2 2 0 0 0 .88-.87c.22-.43.22-.99.22-2.1V14m1-5V4m0 0h-5m5 0-7 7"></path>
</svg><svg viewBox="0 0 24 24" width="24" height="24" fill="none" role="img">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="1"
d="M3.5 3.5h4.2v17H3.5v-17zM15.5 3.5h4.2v17h-4.2v-17zM9.5 3.5h4.2v17H9.5v-17z"></path>
</svg> <Arrow />
<Anchor />
<Check />
<ChevronDown />
<ChevronLeft />
<ChevronRight />
<Cross />
<Info />
<Instagram />
<Linkedin />
<GithubClassic />
<Send />
<Twitter />
<Trash />
<Add />
<ExternalLink />
<Grid /> Icons classic
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100"
viewBox="78 133 100 100" xml:space="preserve" aria-hidden="true"> <path
id="astro-logo"
d="M142.771 135.391c.815 1.012 1.23 2.377 2.063 5.109L163 200.175a75.587 75.587 0 0 0-21.718-7.353l-11.829-39.97a1.538 1.538 0 0 0-2.953.004l-11.685 39.945a75.6 75.6 0 0 0-21.816 7.364l18.255-59.68c.834-2.727 1.251-4.09 2.067-5.101a6.709 6.709 0 0 1 2.719-2.012c1.205-.484 2.63-.484 5.482-.484h13.038c2.855 0 4.283 0 5.489.485a6.705 6.705 0 0 1 2.722 2.018z"></path>
<path fill="#FF5D01"
d="M144.945 203.015c-2.995 2.561-8.972 4.308-15.856 4.308-8.451 0-15.534-2.632-17.414-6.17-.671 2.028-.823 4.349-.823 5.832 0 0-.442 7.279 4.622 12.343a4.76 4.76 0 0 1 4.76-4.761c4.506 0 4.5 3.932 4.497 7.122v.283c0 4.841 2.96 8.992 7.167 10.741a9.763 9.763 0 0 1-.979-4.278c0-4.617 2.71-6.336 5.86-8.334 2.507-1.592 5.291-3.356 7.211-6.899a13.01 13.01 0 0 0 1.571-6.217 13.09 13.09 0 0 0-.616-3.97z"></path>
</svg><svg id="codepen" width="64" height="64" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg" aria-hidden="true"> <g
clip-path="url(#clip-codepen)" fill="url('#codepen-gradient')"> <path
d="M21.937 13.727 19.356 12l2.58-1.727v3.454zm-8.908 7.314V16.23l4.474-2.99 3.607 2.414-8.081 5.387zm-1.03-6.602L8.352 12l3.647-2.44L15.646 12l-3.647 2.439zm-1.031 6.602-8.082-5.387 3.611-2.414 4.471 2.99v4.811zM2.061 10.274 4.642 12l-2.581 1.726v-3.452zm8.907-7.316v4.81l-4.471 2.991-3.611-2.414 8.082-5.387zm2.061 0 8.081 5.387-3.607 2.414-4.474-2.991v-4.81zm10.962 5.251c-.004-.017-.008-.03-.01-.045-.006-.029-.01-.06-.018-.086l-.018-.051c-.008-.024-.018-.05-.025-.074l-.023-.051a.387.387 0 0 0-.035-.067l-.029-.048c-.014-.021-.027-.042-.043-.063l-.035-.044a.547.547 0 0 0-.051-.056c-.016-.015-.027-.028-.041-.04-.021-.018-.039-.034-.061-.049-.016-.013-.029-.024-.045-.035-.008-.004-.012-.01-.018-.014L12.569.174a1.033 1.033 0 0 0-1.145 0L.458 7.485l-.018.014a.312.312 0 0 0-.045.034c-.021.017-.04.032-.06.05a.51.51 0 0 0-.041.04.664.664 0 0 0-.051.055c-.013.014-.023.03-.035.044a1.194 1.194 0 0 0-.108.179c-.007.016-.017.033-.023.051-.01.024-.019.05-.027.074-.004.017-.01.033-.016.051a.57.57 0 0 0-.017.086.97.97 0 0 0-.018.179v7.313c0 .045.004.09.01.135 0 .014.004.029.008.045.005.027.01.057.018.086.004.018.01.033.016.051l.027.076c.008.016.016.031.022.049a.745.745 0 0 0 .036.068l.029.047c.014.021.028.043.043.063a.691.691 0 0 0 .086.102c.014.016.027.027.041.041.02.018.039.033.06.049l.046.035c.006.004.011.01.018.014l10.969 7.313a1.034 1.034 0 0 0 1.142-.003l10.97-7.313.018-.014c.018-.012.031-.023.047-.035.02-.016.039-.031.059-.049a.397.397 0 0 0 .041-.041l.053-.057a.44.44 0 0 0 .035-.045.497.497 0 0 0 .043-.063l.029-.047c.014-.023.023-.045.033-.068a.266.266 0 0 0 .023-.049c.01-.027.02-.053.027-.076.004-.018.012-.033.016-.051a.734.734 0 0 0 .018-.086c.004-.016.008-.031.01-.045.006-.045.01-.09.01-.135V8.341c-.003-.043-.005-.088-.011-.132z"
fill-rule="evenodd"></path> </g> <defs> <clippath id="clip-codepen"> <rect
width="24" height="24"></rect> </clippath> <lineargradient
id="codepen-gradient" x1="50%" y1="0%" x2="50%" y2="100%"> <stop
offset="0%" stop-color="#7A5FFF"> <animate attributeName="stop-color"
values="#7A5FFF; #01FF89; #7A5FFF" dur="4s"
repeatCount="indefinite"></animate> </stop> <stop offset="100%"
stop-color="#01FF89"> <animate attributeName="stop-color"
values="#01FF89; #7A5FFF; #01FF89" dur="4s"
repeatCount="indefinite"></animate> </stop> </lineargradient> </defs>
</svg><svg id="github" width="64" height="64" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" role="img"> <g
clip-path="url(#clip-github)" fill="url('#logo-gradient')"> <path
d="M10 0c5.523 0 10 4.59 10 10.253 0 4.529-2.862 8.371-6.833 9.728-.507.101-.687-.219-.687-.492 0-.338.012-1.442.012-2.814 0-.956-.32-1.58-.679-1.898 2.227-.254 4.567-1.121 4.567-5.059 0-1.12-.388-2.034-1.03-2.752.104-.259.447-1.302-.098-2.714 0 0-.838-.275-2.747 1.051A9.396 9.396 0 0 0 10 4.958a9.375 9.375 0 0 0-2.503.345C5.586 3.977 4.746 4.252 4.746 4.252c-.543 1.412-.2 2.455-.097 2.714-.639.718-1.03 1.632-1.03 2.752 0 3.928 2.335 4.808 4.556 5.067-.286.256-.545.708-.635 1.371-.57.262-2.018.715-2.91-.852 0 0-.529-.985-1.533-1.057 0 0-.975-.013-.068.623 0 0 .655.315 1.11 1.5 0 0 .587 1.83 3.369 1.21.005.857.014 1.665.014 1.909 0 .271-.184.588-.683.493C2.865 18.627 0 14.783 0 10.253 0 4.59 4.478 0 10 0"
fill-rule="evenodd"></path> </g> <defs> <clippath id="clip-github"> <rect
width="20" height="20"></rect> </clippath> <lineargradient
id="logo-gradient" x1="50%" y1="0%" x2="50%" y2="100%"> <stop offset="0%"
stop-color="#7A5FFF"> <animate attributeName="stop-color"
values="#7A5FFF; #01FF89; #7A5FFF" dur="4s"
repeatCount="indefinite"></animate> </stop> <stop offset="100%"
stop-color="#01FF89"> <animate attributeName="stop-color"
values="#01FF89; #7A5FFF; #01FF89" dur="4s"
repeatCount="indefinite"></animate> </stop> </lineargradient> </defs>
</svg><svg width="40" height="40" xmlns="http://www.w3.org/2000/svg"
xml:space="preserve" viewBox="0 0 500 500" fill-opacity="1" role="img"> <g
clip-path="url(#logoSG)" fill="url('#logoSG-gradient')"> <path
d="M473.24 200H250a50 50 0 0 0-50 50c0 27.61 23.3 42.94 50 50 75.86 20.05 98.16 61.27 99 98.24 1 44.23-23.5 101.95-133.21 101.76 7.9.43 75.99 0 84.21 0 110.46 0 200-89.54 200-200V200h-26.76z"></path>
<path
d="M299.99 0H200C89.54 0 0 89.54 0 200s89.54 200 200 200c6.85 0 13.62-.35 20.3-1.02C136.47 390.32 71.4 326.93 71.4 250c0-81.85 73.66-148.38 165.2-149.96V100h167.18v-.09c53.47-1.99 96.21-45.96 96.21-99.91h-200z"></path>
</g> <defs> <clippath id="logoSG"> <rect width="500" height="500"></rect>
</clippath> <lineargradient id="logoSG-gradient" x1="50%" y1="0%" x2="50%"
y2="100%"> <stop offset="0%" stop-color="#7A5FFF"> <animate
attributeName="stop-color" values="#7A5FFF; #01FF89; #7A5FFF" dur="4s"
repeatCount="indefinite"></animate> </stop> <stop offset="100%"
stop-color="#01FF89"> <animate attributeName="stop-color"
values="#01FF89; #7A5FFF; #01FF89" dur="4s"
repeatCount="indefinite"></animate> </stop> </lineargradient> </defs>
</svg><svg role="img" width="24" height="24" viewBox="0 0 24 24"> <mask
id="moon"> <rect x="0" y="0" width="100%" height="100%" fill="white"></rect>
<circle cx="40" cy="8" r="11" fill="black"></circle> </mask> <circle
id="sun" cx="12" cy="12" r="11" mask="url(#moon)"></circle> <g
id="sun-beams"> <line x1="12" y1="1" x2="12" y2="3"></line> <line x1="12"
y1="21" x2="12" y2="23"></line> <line x1="4.22" y1="4.22" x2="5.64"
y2="5.64"></line> <line x1="18.36" y1="18.36" x2="19.78"
y2="19.78"></line> <line x1="1" y1="12" x2="3" y2="12"></line> <line
x1="21" y1="12" x2="23" y2="12"></line> <line x1="4.22" y1="19.78"
x2="5.64" y2="18.36"></line> <line x1="18.36" y1="5.64" x2="19.78"
y2="4.22"></line> </g> </svg><svg viewBox="0 0 100 100" width="100"
height="100" fill="currentColor" role="img"> <path fill="#e62c2e"
d="M68.19 9.18H100L31.82 90.82H0L68.19 9.18z"></path> <path fill="#283172"
d="M87.46 51.33v27.54H64.49l-9.97 11.95H100V36.3L87.46 51.33zM12.54 21.14h22.97l9.97-11.95H0V63.7l12.54-15.03V21.14z"></path>
</svg> <AstroIcon />
<Codepen />
<Github />
<LogoSG />
<MoonSun />
<Slash />