Content Switcher Icon

Free SVG icon from the Carbon Icons collection. Download or copy for use in any project.

Download SVG

Collection: Carbon Icons
Format: SVG, React, Angular, Vue, Web Component, PNG
License: Apache-2.0 - Free for commercial use
Tags: content switcher

The Content Switcher 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/321049.svg" alt="Content Switcher icon" width="24" height="24">

React JSX

<img src="https://proicons.com/icon/321049.svg" alt="Content Switcher icon" width={24} height={24} />

Vue template

<img
  src="https://proicons.com/icon/321049.svg"
  alt="Content Switcher icon"
  :width="24"
  :height="24"
/>

CSS background

.icon-content-switcher {
  background-image: url('https://proicons.com/icon/321049.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>content-switcher</title>
    <g id="content-switcher" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <polygon id="Rectangle-5-Copy-114" fill="#F3F3F3" points="160 74 212 74 212 106 160 106"></polygon>
        <rect id="Rectangle-path-Copy" fill="#565656" fill-rule="nonzero" x="183" y="88" width="1" height="6"></rect>
        <rect id="Rectangle-path-Copy-2" fill="#565656" fill-rule="nonzero" x="186" y="88" width="1" height="6"></rect>
        <path d="M179,85 L179,86 L180,86 L180,96 C180,96.5522847 180.447715,97 181,97 L189,97 C189.552285,97 190,96.5522847 190,96 L190,86 L191,86 L191,85 L179,85 Z M181,96 L181,86 L189,86 L189,96 L181,96 Z" id="Shape-Copy" fill="#565656" fill-rule="nonzero"></path>
        <rect id="Rectangle-path-Copy-3" fill="#565656" fill-rule="nonzero" x="183" y="83" width="4" height="1"></rect>
        <path d="M60,74 L108,74 L108,74 L108,106 L60,106 C57.790861,106 56,104.209139 56,102 L56,78 C56,75.790861 57.790861,74 60,74 Z" id="Rectangle-5-Copy-86" fill="#F3F3F3"></path>
        <polygon id="Rectangle-5-Copy-98" fill="#171717" points="108 74 160 74 160 106 108 106"></polygon>
        <path d="M131.238323,85 C131.397828,85.0002668 131.5477,85.0763722 131.642023,85.205 L132.654173,86.59 L132.953773,87 L139.923123,87 C139.968991,87.0047642 140.002925,87.0448767 140.000023,87.0909 L140.000023,94.9091 C140.002925,94.9551233 139.968991,94.9952358 139.923123,95 L128.076923,95 C128.031055,94.9952358 127.99712,94.9551233 128.000023,94.9091 L128.000023,85.0909 C127.99712,85.0448767 128.031055,85.0047642 128.076923,85 L131.238323,85 L131.238323,85 Z M131.238323,84 L128.076923,84 C127.478319,84.0039086 126.996199,84.492296 127,85.0909 L127,94.9091 C126.996199,95.507704 127.478319,95.9960914 128.076923,96 L139.923123,96 C140.521726,95.9960914 141.003846,95.507704 141.000045,94.9091 L141.000045,87.0909 C141.003846,86.492296 140.521726,86.0039086 139.923123,86 L133.461573,86 L132.449423,84.615 C132.166986,84.2284905 131.717029,84 131.238323,84 Z" id="Shape-Copy-2" fill="#F3F3F3" fill-rule="nonzero"></path>
        <rect id="Rectangle-path-Copy-4" x="127" y="82" width="16" height="16"></rect>
        <path d="M212,74 L260,74 C262.209139,74 264,75.790861 264,78 L264,102 C264,104.209139 262.209139,106 260,106 L212,106 L212,106 L212,74 Z" id="Rectangle-5-Copy-132" fill="#F3F3F3"></path>
        <line x1="212.333333" y1="82.195122" x2="212.333333" y2="97.804878" id="Line-4-Copy-46" stroke="#DCDCDC" stroke-linecap="square"></line>
        <path d="M245.46975,89.8291 C244.266857,86.7208978 241.330465,84.6260044 238,84.5 C234.669535,84.6260044 231.733143,86.7208978 230.53025,89.8291 C230.489723,89.9394294 230.489723,90.0605706 230.53025,90.1709 C231.733143,93.2791022 234.669535,95.3739956 238,95.5 C241.330465,95.3739956 244.266857,93.2791022 245.46975,90.1709 C245.510277,90.0605706 245.510277,89.9394294 245.46975,89.8291 Z M238,94.5 C235.35,94.5 232.54785,92.5371 231.535,90 C232.54785,87.4629 235.35,85.5 238,85.5 C240.65,85.5 243.45215,87.4629 244.465,90 C243.45215,92.5371 240.65,94.5 238,94.5 Z" id="Shape-Copy-3" fill="#565656" fill-rule="nonzero"></path>
        <path d="M238,87 C236.343146,87 235,88.3431458 235,90 C235,91.6568542 236.343146,93 238,93 C239.656854,93 241,91.6568542 241,90 C240.998181,88.3438997 239.6561,87.0018187 238,87 L238,87 Z M238,92 C236.895431,92 236,91.1045695 236,90 C236,88.8954305 236.895431,88 238,88 C239.104569,88 240,88.8954305 240,90 C239.998815,91.1040783 239.104078,91.998815 238,92 L238,92 Z" id="Shape-Copy-4" fill="#565656" fill-rule="nonzero"></path>
        <rect id="Rectangle-path-Copy-5" x="230" y="82" width="16" height="16"></rect>
        <polygon id="Shape-Copy-5" fill="#3D3D3D" fill-rule="nonzero" points="90 90 86.5 93.5 85.793 92.793 88.586 90 85.793 87.207 86.5 86.5"></polygon>
        <polygon id="Shape-Copy-6" fill="#3D3D3D" fill-rule="nonzero" points="75 90 78.5 86.5 79.207 87.207 76.414 90 79.207 92.793 78.5 93.5"></polygon>
        <polygon id="Rectangle-path-Copy-6" fill="#3D3D3D" fill-rule="nonzero" transform="translate(82.499909, 90.000036) rotate(-75.000100) translate(-82.499909, -90.000036) " points="77.4574086 89.5000365 87.5424086 89.5000365 87.5424086 90.4999365 77.4574086 90.4999365"></polygon>
        <rect id="Rectangle-path-Copy-7" transform="translate(83.500000, 90.000000) rotate(-90.000000) translate(-83.500000, -90.000000) " x="75.5" y="82" width="16" height="16"></rect>
    </g>
</svg>

Copied!

Content Switcher Icon

More from Carbon Icons