Focus Icon
Free SVG icon from the Mage Icons collection. Download or copy for use in any project.
The Focus icon is available as a free SVG and is ready to drop into any web or app project.
img tag
<img src="https://proicons.com/icon/310136.svg" alt="Focus icon" width="24" height="24">
React JSX
<img src="https://proicons.com/icon/310136.svg" alt="Focus icon" width={24} height={24} />
Vue template
<img src="https://proicons.com/icon/310136.svg" alt="Focus icon" :width="24" :height="24" />
CSS background
.icon-focus {
background-image: url('https://proicons.com/icon/310136.svg');
background-size: contain;
background-repeat: no-repeat;
width: 24px;
height: 24px;
display: inline-block;
}
SVG markup
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M20.2277 9.05933C20.0308 9.05933 19.8419 8.98122 19.7026 8.84219C19.5634 8.70316 19.4852 8.51459 19.4852 8.31797V6.48933C19.4852 5.96502 19.2765 5.46217 18.9052 5.09143C18.5338 4.72068 18.0301 4.5124 17.505 4.5124H14.7525C14.5555 4.5124 14.3667 4.43426 14.2274 4.29523C14.0881 4.1562 14.0099 3.96766 14.0099 3.77104C14.0099 3.57443 14.0881 3.38586 14.2274 3.24683C14.3667 3.1078 14.5555 3.02969 14.7525 3.02969H17.505C18.4303 3.03488 19.3163 3.40416 19.9706 4.05741C20.6249 4.71066 20.9948 5.59517 21 6.51899V8.34763C20.9897 8.5434 20.9032 8.72744 20.7589 8.86041C20.6147 8.99338 20.424 9.06475 20.2277 9.05933Z" fill="black"/> <path d="M17.505 20.9506H14.7525C14.5555 20.9506 14.3667 20.8725 14.2274 20.7334C14.0881 20.5944 14.0099 20.4058 14.0099 20.2092C14.0099 20.0126 14.0881 19.8241 14.2274 19.685C14.3667 19.546 14.5555 19.4679 14.7525 19.4679H17.505C18.0301 19.4679 18.5338 19.2596 18.9052 18.8888C19.2765 18.5181 19.4852 18.0152 19.4852 17.4909V15.682C19.4852 15.4854 19.5634 15.2969 19.7026 15.1578C19.8419 15.0188 20.0308 14.9407 20.2277 14.9407C20.4247 14.9407 20.6136 15.0188 20.7528 15.1578C20.8921 15.2969 20.9703 15.4854 20.9703 15.682V17.5107C20.9651 18.4345 20.5952 19.319 19.9409 19.9723C19.2866 20.6255 18.4006 20.9948 17.4753 21L17.505 20.9506Z" fill="black"/> <path d="M9.23761 20.9506H6.48514C5.55991 20.9479 4.67347 20.5792 4.02016 19.9251C3.36685 19.271 3 18.385 3 17.4613V15.682C3 15.4854 3.07823 15.2969 3.21749 15.1578C3.35675 15.0188 3.54563 14.9407 3.74257 14.9407C3.93952 14.9407 4.12838 15.0188 4.26764 15.1578C4.4069 15.2969 4.48515 15.4854 4.48515 15.682V17.5107C4.48515 18.035 4.69378 18.5379 5.06513 18.9086C5.43649 19.2794 5.94017 19.4876 6.46535 19.4876H9.21782C9.41477 19.4876 9.60363 19.5658 9.74289 19.7048C9.88215 19.8438 9.9604 20.0324 9.9604 20.229C9.9604 20.4256 9.88215 20.6142 9.74289 20.7532C9.60363 20.8922 9.41477 20.9704 9.21782 20.9704L9.23761 20.9506Z" fill="black"/> <path d="M3.74257 9.05929C3.54563 9.05929 3.35675 8.98118 3.21749 8.84215C3.07823 8.70312 3 8.51455 3 8.31793V6.48929C3 5.56558 3.36685 4.67954 4.02016 4.02545C4.67347 3.37137 5.55991 3.00262 6.48514 3H9.23761C9.43456 3 9.62344 3.0781 9.7627 3.21713C9.90196 3.35616 9.98019 3.54473 9.98019 3.74135C9.98019 3.93797 9.90196 4.12651 9.7627 4.26554C9.62344 4.40457 9.43456 4.4827 9.23761 4.4827H6.48514C5.95996 4.4827 5.45628 4.69098 5.08493 5.06173C4.71357 5.43248 4.50494 5.93532 4.50494 6.45964V8.28828C4.50762 8.38942 4.4898 8.49008 4.45256 8.58418C4.41532 8.67828 4.35943 8.76391 4.28824 8.83591C4.21704 8.90791 4.132 8.96479 4.03823 9.00318C3.94447 9.04157 3.84391 9.06065 3.74257 9.05929Z" fill="black"/> <path d="M16.6832 11.9753C16.6826 13.0615 16.3048 14.1139 15.6141 14.9533C14.9235 15.7926 13.9627 16.3669 12.8955 16.5783C11.8282 16.7897 10.7206 16.6251 9.76129 16.1126C8.80198 15.6001 8.05033 14.7714 7.63441 13.7677C7.21849 12.7639 7.16403 11.6473 7.48031 10.608C7.7966 9.56863 8.46405 8.67094 9.36896 8.06783C10.2739 7.46472 11.3602 7.19349 12.443 7.30038C13.5257 7.40727 14.5379 7.88567 15.3069 8.65404C15.7453 9.08897 16.0928 9.60654 16.329 10.1767C16.5653 10.7469 16.6857 11.3582 16.6832 11.9753Z" fill="black"/> </svg>
Focus in other icon packs
Copied!