Skeleton Text Icon
Free SVG icon from the Carbon Icons collection. Download or copy for use in any project.
The Skeleton Text 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/321109.svg" alt="Skeleton Text icon" width="24" height="24">
React JSX
<img src="https://proicons.com/icon/321109.svg" alt="Skeleton Text icon" width={24} height={24} />
Vue template
<img src="https://proicons.com/icon/321109.svg" alt="Skeleton Text icon" :width="24" :height="24" />
CSS background
.icon-skeleton-text {
background-image: url('https://proicons.com/icon/321109.svg');
background-size: contain;
background-repeat: no-repeat;
width: 24px;
height: 24px;
display: inline-block;
}
SVG markup
<?xml version="1.0" encoding="UTF-8"?>
<svg width="320px" height="180px" viewBox="0 0 320 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>skeleton-text</title>
<defs>
<linearGradient x1="-21.9775656%" y1="50%" x2="113.47099%" y2="50%" id="linearGradient-1">
<stop stop-color="#C6C6C6" stop-opacity="0" offset="0%"></stop>
<stop stop-color="#C6C6C6" offset="100%"></stop>
</linearGradient>
</defs>
<g id="skeleton-text" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<rect id="Rectangle" fill="#E0E0E0" x="56" y="82" width="208" height="16"></rect>
<rect id="Rectangle" fill="#C6C6C6" x="56" y="82" width="156" height="16"></rect>
<rect id="Rectangle" fill="url(#linearGradient-1)" transform="translate(215.500000, 90.000000) scale(-1, 1) translate(-215.500000, -90.000000) " x="212" y="82" width="7" height="16"></rect>
</g>
</svg>
Copied!