css logo
css from Skill Icons by tandpfun · Default · MIT Free for personal and commercial use.
- Name
- css
- Set
- Skill Icons
- Style
- Default
- Viewbox
- 256×256
- License
- MIT
The same logo in other sets
Use the css logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#0277bd" rx="60"/><path fill="#ebebeb" d="m53.753 102.651l2.862 31.942h71.481v-31.942zM128.095 38H48l2.904 31.942h77.191zm0 180.841v-33.233l-.14.037l-35.574-9.605l-2.274-25.476H58.042l4.475 50.154l65.431 18.164z"/><path fill="#fff" d="m167.318 134.593l-3.708 41.426l-35.625 9.616v33.231l65.483-18.148l.48-5.397l7.506-84.092l.779-8.578L208 38h-80.015v31.942h45.009l-2.906 32.709h-42.103v31.942z"/></g></svg>
React
import type { SVGProps } from "react";
export function SkillIconsCss(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#0277bd" rx="60"/><path fill="#ebebeb" d="m53.753 102.651l2.862 31.942h71.481v-31.942zM128.095 38H48l2.904 31.942h77.191zm0 180.841v-33.233l-.14.037l-35.574-9.605l-2.274-25.476H58.042l4.475 50.154l65.431 18.164z"/><path fill="#fff" d="m167.318 134.593l-3.708 41.426l-35.625 9.616v33.231l65.483-18.148l.48-5.397l7.506-84.092l.779-8.578L208 38h-80.015v31.942h45.009l-2.906 32.709h-42.103v31.942z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#0277bd" rx="60"/><path fill="#ebebeb" d="m53.753 102.651l2.862 31.942h71.481v-31.942zM128.095 38H48l2.904 31.942h77.191zm0 180.841v-33.233l-.14.037l-35.574-9.605l-2.274-25.476H58.042l4.475 50.154l65.431 18.164z"/><path fill="#fff" d="m167.318 134.593l-3.708 41.426l-35.625 9.616v33.231l65.483-18.148l.48-5.397l7.506-84.092l.779-8.578L208 38h-80.015v31.942h45.009l-2.906 32.709h-42.103v31.942z"/></g></svg> </template>
CSS
.icon-css {
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%20256%20256%22%3E%3Cg%20fill%3D%22none%22%3E%3Crect%20width%3D%22256%22%20height%3D%22256%22%20fill%3D%22%230277bd%22%20rx%3D%2260%22%2F%3E%3Cpath%20fill%3D%22%23ebebeb%22%20d%3D%22m53.753%20102.651l2.862%2031.942h71.481v-31.942zM128.095%2038H48l2.904%2031.942h77.191zm0%20180.841v-33.233l-.14.037l-35.574-9.605l-2.274-25.476H58.042l4.475%2050.154l65.431%2018.164z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m167.318%20134.593l-3.708%2041.426l-35.625%209.616v33.231l65.483-18.148l.48-5.397l7.506-84.092l.779-8.578L208%2038h-80.015v31.942h45.009l-2.906%2032.709h-42.103v31.942z%22%2F%3E%3C%2Fg%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%20256%20256%22%3E%3Cg%20fill%3D%22none%22%3E%3Crect%20width%3D%22256%22%20height%3D%22256%22%20fill%3D%22%230277bd%22%20rx%3D%2260%22%2F%3E%3Cpath%20fill%3D%22%23ebebeb%22%20d%3D%22m53.753%20102.651l2.862%2031.942h71.481v-31.942zM128.095%2038H48l2.904%2031.942h77.191zm0%20180.841v-33.233l-.14.037l-35.574-9.605l-2.274-25.476H58.042l4.475%2050.154l65.431%2018.164z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m167.318%20134.593l-3.708%2041.426l-35.625%209.616v33.231l65.483-18.148l.48-5.397l7.506-84.092l.779-8.578L208%2038h-80.015v31.942h45.009l-2.906%2032.709h-42.103v31.942z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/skill-icons/css.svg?color=%231a73e8&size=48
