lock icon
lock-bold from Solar by 480 Design · Bold · Security · CC-BY-4.0 Attribution required.
- Name
- lock-bold
- Set
- Solar
- Style
- Bold
- Category
- Security
- Viewbox
- 24×24
- License
- CC BY 4.0
5 other variants in Solar
The same icon in other sets
lock-filledAnt Design IconslockBootstrap IconslockBoxIcons v2lockBoxIcons v2 SolidlockCatppuccin IconslockCodiconslockElement Pluslock-fillEva IconslockFramework7 IconslockFont Awesome 6 SolidlockFont Awesome SolidlockFeather Iconslock-outlineFlowbite Iconslock-16-filledFluent UI System IconslockFirefox OS Emojilockcss.gglockHuge IconslockHumbleiconslockIconParklockIconPark OutlinelockIconPark SolidlockIconPark TwoTonelockIconoirlockLine Awesome
More security icons from Solar
barcode-boldbarcode-scan-boldbomb-boldbomb-emoji-boldbomb-minimalistic-boldcode-scan-boldeye-boldeye-closed-boldeye-scan-boldincognito-boldkey-boldkey-minimalistic-2-boldkey-minimalistic-boldkey-minimalistic-square-2-boldkey-minimalistic-square-3-boldkey-minimalistic-square-boldkey-square-2-boldkey-square-boldlock-keyhole-boldlock-keyhole-minimalistic-boldlock-keyhole-minimalistic-unlocked-boldlock-keyhole-unlocked-boldlock-password-boldlock-password-unlocked-bold
Use the lock icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M5.25 10.0546V8C5.25 4.27208 8.27208 1.25 12 1.25C15.7279 1.25 18.75 4.27208 18.75 8V10.0546C19.8648 10.1379 20.5907 10.348 21.1213 10.8787C22 11.7574 22 13.1716 22 16C22 18.8284 22 20.2426 21.1213 21.1213C20.2426 22 18.8284 22 16 22H8C5.17157 22 3.75736 22 2.87868 21.1213C2 20.2426 2 18.8284 2 16C2 13.1716 2 11.7574 2.87868 10.8787C3.40931 10.348 4.13525 10.1379 5.25 10.0546ZM6.75 8C6.75 5.10051 9.10051 2.75 12 2.75C14.8995 2.75 17.25 5.10051 17.25 8V10.0036C16.867 10 16.4515 10 16 10H8C7.54849 10 7.13301 10 6.75 10.0036V8Z" clip-rule="evenodd"/></svg>
React
import type { SVGProps } from "react";
export function SolarLockBold(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fillRule="evenodd" d="M5.25 10.0546V8C5.25 4.27208 8.27208 1.25 12 1.25C15.7279 1.25 18.75 4.27208 18.75 8V10.0546C19.8648 10.1379 20.5907 10.348 21.1213 10.8787C22 11.7574 22 13.1716 22 16C22 18.8284 22 20.2426 21.1213 21.1213C20.2426 22 18.8284 22 16 22H8C5.17157 22 3.75736 22 2.87868 21.1213C2 20.2426 2 18.8284 2 16C2 13.1716 2 11.7574 2.87868 10.8787C3.40931 10.348 4.13525 10.1379 5.25 10.0546ZM6.75 8C6.75 5.10051 9.10051 2.75 12 2.75C14.8995 2.75 17.25 5.10051 17.25 8V10.0036C16.867 10 16.4515 10 16 10H8C7.54849 10 7.13301 10 6.75 10.0036V8Z" clipRule="evenodd"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M5.25 10.0546V8C5.25 4.27208 8.27208 1.25 12 1.25C15.7279 1.25 18.75 4.27208 18.75 8V10.0546C19.8648 10.1379 20.5907 10.348 21.1213 10.8787C22 11.7574 22 13.1716 22 16C22 18.8284 22 20.2426 21.1213 21.1213C20.2426 22 18.8284 22 16 22H8C5.17157 22 3.75736 22 2.87868 21.1213C2 20.2426 2 18.8284 2 16C2 13.1716 2 11.7574 2.87868 10.8787C3.40931 10.348 4.13525 10.1379 5.25 10.0546ZM6.75 8C6.75 5.10051 9.10051 2.75 12 2.75C14.8995 2.75 17.25 5.10051 17.25 8V10.0036C16.867 10 16.4515 10 16 10H8C7.54849 10 7.13301 10 6.75 10.0036V8Z" clip-rule="evenodd"/></svg> </template>
CSS
.icon-lock-bold {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M5.25%2010.0546V8C5.25%204.27208%208.27208%201.25%2012%201.25C15.7279%201.25%2018.75%204.27208%2018.75%208V10.0546C19.8648%2010.1379%2020.5907%2010.348%2021.1213%2010.8787C22%2011.7574%2022%2013.1716%2022%2016C22%2018.8284%2022%2020.2426%2021.1213%2021.1213C20.2426%2022%2018.8284%2022%2016%2022H8C5.17157%2022%203.75736%2022%202.87868%2021.1213C2%2020.2426%202%2018.8284%202%2016C2%2013.1716%202%2011.7574%202.87868%2010.8787C3.40931%2010.348%204.13525%2010.1379%205.25%2010.0546ZM6.75%208C6.75%205.10051%209.10051%202.75%2012%202.75C14.8995%202.75%2017.25%205.10051%2017.25%208V10.0036C16.867%2010%2016.4515%2010%2016%2010H8C7.54849%2010%207.13301%2010%206.75%2010.0036V8Z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M5.25%2010.0546V8C5.25%204.27208%208.27208%201.25%2012%201.25C15.7279%201.25%2018.75%204.27208%2018.75%208V10.0546C19.8648%2010.1379%2020.5907%2010.348%2021.1213%2010.8787C22%2011.7574%2022%2013.1716%2022%2016C22%2018.8284%2022%2020.2426%2021.1213%2021.1213C20.2426%2022%2018.8284%2022%2016%2022H8C5.17157%2022%203.75736%2022%202.87868%2021.1213C2%2020.2426%202%2018.8284%202%2016C2%2013.1716%202%2011.7574%202.87868%2010.8787C3.40931%2010.348%204.13525%2010.1379%205.25%2010.0546ZM6.75%208C6.75%205.10051%209.10051%202.75%2012%202.75C14.8995%202.75%2017.25%205.10051%2017.25%208V10.0036C16.867%2010%2016.4515%2010%2016%2010H8C7.54849%2010%207.13301%2010%206.75%2010.0036V8Z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/solar/lock-bold.svg?color=%231a73e8&size=48
