Big Sur Icon

bigsuricon-fritzing.svg

bigsuricon-fritzing_new-dimensions.svg

bigsuricon-fritzing_original-dimensions.svg

bigsuricon.svg

bigsuricon2.svg

<svg width="512" height="512" version="1.1" viewBox="-256 -256 512 512" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <defs>
    <linearGradient id="bg_gradient" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0" stop-color="hsl(100, 100%, 45%)" />
      <stop offset="1" stop-color="hsl(130, 100%, 30%)" />
    </linearGradient>
    <filter id="innershadow" x="-30%" y="-30%" width="160%" height="160%">
      <feFlood flood-color="rgb(0,0,0)" flood-opacity="0.9" />
      <feComposite operator="out" in2="SourceAlpha"/>
      <feGaussianBlur stdDeviation="8"/>
      <feOffset dx="0" dy="-2" />
      <feComposite operator="atop" in2="SourceGraphic"/>
    </filter>
    <filter id="innerglow" x="-30%" y="-30%" width="160%" height="160%">
      <feFlood flood-color="hsl(115, 100%, 40%)" flood-opacity="1.0" />
      <feComposite operator="out" in2="SourceAlpha"/>
      <feGaussianBlur stdDeviation="4"/>
      <feOffset dx="0" dy="-3" />
      <feComposite operator="atop" in2="SourceGraphic"/>
    </filter>
    <filter id="dropshadow" x="-20%" y="-20%" height="160%" width="140%">
      <feFlood flood-color="rgb(0,0,0)" flood-opacity="0.4" />
      <feComposite operator="in" in2="SourceAlpha" />
      <feGaussianBlur stdDeviation="7"/>
      <feOffset dx="0" dy="10" result="offset" />
      <feComposite operator="over" in="SourceGraphic" in2="offset" />
    </filter>
  </defs>
  <g id="icon">
    <rect x="-206" y="-206" width="412" height="412" rx="90" fill="url(#bg_gradient)" stroke="none" />
    <g filter="url(#dropshadow)">
      <g filter="url(#innerglow)">
        <g filter="url(#innershadow)" stroke="#fff" fill="none" stroke-width="40" stroke-linecap="round" stroke-linejoin="round" >
          <path d="M-140,-10 l80,80 l190,-140" />
        </g>
      </g>
    </g>
  </g>


  <!-- OVERLAY -->
  <g id="overlay" fill="none" style="display:none;">
    <g stroke="rgba(0,0,0,0.25)">
      <rect x="-256" y="-256" width="512" height="512" rx="140" />
      <rect x="-231" y="-231" width="462" height="462" rx="115" />
    </g>
    <rect x="-206" y="-206" width="412" height="412" rx="90" stroke="rgb(214, 7, 104)" />
    <g stroke="rgba(214, 7, 104, 0.25)">
      <!-- inner rectangle -->
      <rect x="-180" y="-180" width="360" height="360" />
      <!-- diagonal lines -->
      <line x1="-180" y1="-180" x2="180" y2="180" fill="none" />
      <line x1="-180" y1="180" x2="180" y2="-180" fill="none" />
      <!-- vertical lines -->
      <line x1="-76" y1="-206" x2="-76" y2="206" fill="none" />
      <line x1="0" y1="-206" x2="0" y2="206" fill="none" />
      <line x1="76" y1="-206" x2="76" y2="206" fill="none" />
      <!-- horizontal lines -->
      <line x1="-206" y1="-76" x2="206" y2="-76" fill="none" />
      <line x1="-206" y1="0" x2="206" y2="0" fill="none" />
      <line x1="-206" y1="76" x2="206" y2="76" fill="none" />
      <!-- inner circles -->
      <circle cx="0" cy="0" r="180" fill="none" />
      <circle cx="0" cy="0" r="107.5" fill="none" />
      <circle cx="0" cy="0" r="76" fill="none" />
    </g>
  </g>
</svg>