Original icon colors are kept until you pick a new color.
Optical Disk - Vector and 3D Icons
Source, author, and license are available in the preview and icon details. Optical Disk - Free for commercial use. License shown on every icon.. No Sign-Up Required | 100% Browser-Based Processing
<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" width="36" height="36" role="img" aria-label="Optical Disk icon"><title>Optical Disk - Fluent UI Emoji icon</title><desc>Free Optical Disk vector icon from the Fluent UI Emoji open-source icon library; scalable W3C SVG 2.0 graphic for web and design use.</desc> <g filter="url(#nx32052_filter0_iii_18_19843)"> <path fill-rule="evenodd" clip-rule="evenodd" d="M16.1881 30.0166C23.9293 30.0166 30.2047 23.7412 30.2047 16C30.2047 8.25885 23.9293 1.9834 16.1881 1.9834C8.44696 1.9834 2.17151 8.25885 2.17151 16C2.17151 23.7412 8.44696 30.0166 16.1881 30.0166ZM16.1881 19.3118C18.0172 19.3118 19.5 17.8291 19.5 16C19.5 14.1709 18.0172 12.6882 16.1881 12.6882C14.3591 12.6882 12.8763 14.1709 12.8763 16C12.8763 17.8291 14.3591 19.3118 16.1881 19.3118Z" fill="url(#nx32052_paint0_linear_18_19843)"/> </g> <g filter="url(#nx32052_filter1_f_18_19843)"> <path fill-rule="evenodd" clip-rule="evenodd" d="M16.1881 29.1159C23.4318 29.1159 29.304 23.2437 29.304 16C29.304 8.75625 23.4318 2.88403 16.1881 2.88403C8.94436 2.88403 3.07214 8.75625 3.07214 16C3.07214 23.2437 8.94436 29.1159 16.1881 29.1159ZM19.9596 16C19.9596 17.8291 18.0172 19.9029 16.1881 19.9029C14.359 19.9029 12.1914 17.8291 12.1914 16C12.1914 14.1709 14.359 11.9845 16.1881 11.9845C18.0172 11.9845 19.9596 14.1709 19.9596 16Z" fill="url(#nx32052_paint1_linear_18_19843)"/> </g> <g filter="url(#nx32052_filter2_f_18_19843)"> <path d="M12.8942 13.1752C13.69 12.2481 14.8705 11.6608 16.1881 11.6608C17.4006 11.6608 18.497 12.1582 19.2844 12.96L25.0673 7.1771C25.3013 6.9431 25.3028 6.5628 25.0591 6.33891C22.724 4.19366 19.609 2.88403 16.1881 2.88403C12.5662 2.88403 9.28725 4.35209 6.91373 6.72561C6.83554 6.8038 6.75834 6.88298 6.68213 6.96311L12.8942 13.1752Z" fill="url(#nx32052_paint2_linear_18_19843)"/> </g> <g filter="url(#nx32052_filter3_f_18_19843)"> <path d="M19.0129 19.2939C18.2538 19.9455 17.2669 20.3392 16.1881 20.3392C15.0042 20.3392 13.931 19.8651 13.1481 19.0963L7.36778 24.8767C7.13279 25.1117 7.13246 25.494 7.37861 25.7172C9.70676 27.8292 12.7972 29.116 16.1881 29.116C19.3572 29.116 22.2639 27.992 24.5311 26.121C24.7696 25.9241 25.001 25.719 25.225 25.506L19.0129 19.2939Z" fill="url(#nx32052_paint3_linear_18_19843)"/> </g> <g filter="url(#nx32052_filter4_f_18_19843)"> <path d="M16.1881 20.3642C18.5984 20.3642 20.5523 18.4103 20.5523 16C20.5523 13.5898 18.5984 11.6359 16.1881 11.6359C13.7779 11.6359 11.824 13.5898 11.824 16C11.824 18.4103 13.7779 20.3642 16.1881 20.3642Z" stroke="#C6B7DC" stroke-width="0.05"/> </g> <g filter="url(#nx32052_filter5_f_18_19843)"> <path d="M26.4697 7.85559L19.2182 13.8809C19.6738 14.5441 19.9596 15.2983 19.9596 16C19.9596 16.8956 19.4939 17.8498 18.8038 18.5906C21.1888 20.7779 24.1433 23.4804 25.7741 24.9519C27.9638 22.6081 29.304 19.4606 29.304 16C29.304 12.9226 28.2442 10.0928 26.4697 7.85559Z" fill="url(#nx32052_paint4_linear_18_19843)"/> <path d="M26.4697 7.85559L19.2182 13.8809C19.6738 14.5441 19.9596 15.2983 19.9596 16C19.9596 16.8956 19.4939 17.8498 18.8038 18.5906C21.1888 20.7779 24.1433 23.4804 25.7741 24.9519C27.9638 22.6081 29.304 19.4606 29.304 16C29.304 12.9226 28.2442 10.0928 26.4697 7.85559Z" fill="url(#nx32052_paint5_linear_18_19843)"/> <path d="M26.4697 7.85559L19.2182 13.8809C19.6738 14.5441 19.9596 15.2983 19.9596 16C19.9596 16.8956 19.4939 17.8498 18.8038 18.5906C21.1888 20.7779 24.1433 23.4804 25.7741 24.9519C27.9638 22.6081 29.304 19.4606 29.304 16C29.304 12.9226 28.2442 10.0928 26.4697 7.85559Z" fill="url(#nx32052_paint6_linear_18_19843)"/> </g> <g filter="url(#nx32052_filter6_f_18_19843)"> <path d="M5.9065 7.85559L13.158 13.8809C12.7024 14.5441 12.4166 15.2983 12.4166 16C12.4166 16.8956 12.8823 17.8498 13.5724 18.5906C11.1874 20.7779 8.23288 23.4804 6.60209 24.9519C4.41237 22.6081 3.07214 19.4606 3.07214 16C3.07214 12.9226 4.13196 10.0928 5.9065 7.85559Z" fill="url(#nx32052_paint7_linear_18_19843)"/> <path d="M5.9065 7.85559L13.158 13.8809C12.7024 14.5441 12.4166 15.2983 12.4166 16C12.4166 16.8956 12.8823 17.8498 13.5724 18.5906C11.1874 20.7779 8.23288 23.4804 6.60209 24.9519C4.41237 22.6081 3.07214 19.4606 3.07214 16C3.07214 12.9226 4.13196 10.0928 5.9065 7.85559Z" fill="url(#nx32052_paint8_linear_18_19843)"/> <path d="M5.9065 7.85559L13.158 13.8809C12.7024 14.5441 12.4166 15.2983 12.4166 16C12.4166 16.8956 12.8823 17.8498 13.5724 18.5906C11.1874 20.7779 8.23288 23.4804 6.60209 24.9519C4.41237 22.6081 3.07214 19.4606 3.07214 16C3.07214 12.9226 4.13196 10.0928 5.9065 7.85559Z" fill="url(#nx32052_paint9_linear_18_19843)"/> </g> <g filter="url(#nx32052_filter7_i_18_19843)"> <path fill-rule="evenodd" clip-rule="evenodd" d="M16.1881 20.3392C18.5846 20.3392 20.5273 18.3965 20.5273 16C20.5273 13.6036 18.5846 11.6609 16.1881 11.6609C13.7917 11.6609 11.849 13.6036 11.849 16C11.849 18.3965 13.7917 20.3392 16.1881 20.3392ZM19.5 16C19.5 17.8291 18.0172 19.3119 16.1881 19.3119C14.3591 19.3119 12.8763 17.8291 12.8763 16C12.8763 14.171 14.3591 12.6882 16.1881 12.6882C18.0172 12.6882 19.5 14.171 19.5 16Z" fill="url(#nx32052_paint10_radial_18_19843)"/> </g> <defs> <filter id="nx32052_filter0_iii_18_19843" x="1.92151" y="1.7334" width="28.5332" height="28.5332" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/> <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/> <feOffset dy="-0.25"/> <feGaussianBlur stdDeviation="0.25"/> <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/> <feColorMatrix type="matrix" values="0 0 0 0 0.623529 0 0 0 0 0.454902 0 0 0 0 0.764706 0 0 0 1 0"/> <feBlend mode="normal" in2="shape" result="effect1_innerShadow_18_19843"/> <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/> <feOffset dx="0.25"/> <feGaussianBlur stdDeviation="0.25"/> <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/> <feColorMatrix type="matrix" values="0 0 0 0 0.74902 0 0 0 0 0.737255 0 0 0 0 0.764706 0 0 0 1 0"/> <feBlend mode="normal" in2="effect1_innerShadow_18_19843" result="effect2_innerShadow_18_19843"/> <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/> <feOffset dx="-0.25" dy="0.25"/> <feGaussianBlur stdDeviation="0.25"/> <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/> <feColorMatrix type="matrix" values="0 0 0 0 0.905882 0 0 0 0 0.882353 0 0 0 0 0.92549 0 0 0 1 0"/> <feBlend mode="normal" in2="effect2_innerShadow_18_19843" result="effect3_innerShadow_18_19843"/> </filter> <filter id="nx32052_filter1_f_18_19843" x="2.82214" y="2.63403" width="26.7319" height="26.7319" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/> <feGaussianBlur stdDeviation="0.125" result="effect1_foregroundBlur_18_19843"/> </filter> <filter id="nx32052_filter2_f_18_19843" x="6.43213" y="2.63403" width="19.0602" height="10.7911" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/> <feGaussianBlur stdDeviation="0.125" result="effect1_foregroundBlur_18_19843"/> </filter> <filter id="nx32052_filter3_f_18_19843" x="6.94275" y="18.8463" width="18.5322" height="10.5197" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/> <feGaussianBlur stdDeviation="0.125" result="effect1_foregroundBlur_18_19843"/> </filter> <filter id="nx32052_filter4_f_18_19843" x="11.699" y="11.5108" width="8.97832" height="8.97832" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/> <feGaussianBlur stdDeviation="0.05" result="effect1_foregroundBlur_18_19843"/> </filter> <filter id="nx32052_filter5_f_18_19843" x="18.3038" y="7.35559" width="11.5002" height="18.0963" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/> <feGaussianBlur stdDeviation="0.25" result="effect1_foregroundBlur_18_19843"/> </filter> <filter id="nx32052_filter6_f_18_19843" x="2.57214" y="7.35559" width="11.5002" height="18.0963" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/> <feGaussianBlur stdDeviation="0.25" result="effect1_foregroundBlur_18_19843"/> </filter> <filter id="nx32052_filter7_i_18_19843" x="11.599" y="11.6609" width="8.92834" height="8.67834" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/> <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/> <feOffset dx="-0.25"/> <feGaussianBlur stdDeviation="0.25"/> <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/> <feColorMatrix type="matrix" values="0 0 0 0 0.741176 0 0 0 0 0.678431 0 0 0 0 0.811765 0 0 0 1 0"/> <feBlend mode="normal" in2="shape" result="effect1_innerShadow_18_19843"/> </filter> <linearGradient id="nx32052_paint0_linear_18_19843" x1="16.1881" y1="1.9834" x2="16.1881" y2="30.0166" gradientUnits="userSpaceOnUse"> <stop stop-color="#D0C9D8"/> <stop offset="1" stop-color="#B09AC4"/> </linearGradient> <linearGradient id="nx32052_paint1_linear_18_19843" x1="16.1881" y1="8.41938" x2="16.1881" y2="29.1159" gradientUnits="userSpaceOnUse"> <stop stop-color="#D1C7DB"/> <stop offset="1" stop-color="#BFACD0"/> </linearGradient> <linearGradient id="nx32052_paint2_linear_18_19843" x1="25.2423" y1="6.91827" x2="11.7807" y2="6.91827" gradientUnits="userSpaceOnUse"> <stop stop-color="#FDEBFF"/> <stop offset="1" stop-color="#FDEBFF" stop-opacity="0"/> </linearGradient> <linearGradient id="nx32052_paint3_linear_18_19843" x1="11.3658" y1="19.9405" x2="19.2293" y2="19.9405" gradientUnits="userSpaceOnUse"> <stop stop-color="#EBD8FE"/> <stop offset="1" stop-color="#EBD8FE" stop-opacity="0"/> </linearGradient> <linearGradient id="nx32052_paint4_linear_18_19843" x1="24.0539" y1="9.74996" x2="24.0539" y2="22.4375" gradientUnits="userSpaceOnUse"> <stop stop-color="#E8C0DD"/> <stop offset="0.295567" stop-color="#EED0DE"/> <stop offset="0.655513" stop-color="#D0CFDE"/> <stop offset="1" stop-color="#CDB9F2"/> </linearGradient> <linearGradient id="nx32052_paint5_linear_18_19843" x1="22.1875" y1="10.9375" x2="23.5" y2="12.75" gradientUnits="userSpaceOnUse"> <stop offset="0.234399" stop-color="#D2C8DC"/> <stop offset="1" stop-color="#D2C8DC" stop-opacity="0"/> </linearGradient> <linearGradient id="nx32052_paint6_linear_18_19843" x1="21.7188" y1="21.25" x2="22.9063" y2="19.8125" gradientUnits="userSpaceOnUse"> <stop stop-color="#C6B6D5"/> <stop offset="1" stop-color="#C6B6D5" stop-opacity="0"/> </linearGradient> <linearGradient id="nx32052_paint7_linear_18_19843" x1="9.75" y1="22.125" x2="9.75" y2="10.8125" gradientUnits="userSpaceOnUse"> <stop stop-color="#E8C0DD"/> <stop offset="0.295567" stop-color="#EED0DE"/> <stop offset="0.655513" stop-color="#D0CFDE"/> <stop offset="1" stop-color="#CDB9F2"/> </linearGradient> <linearGradient id="nx32052_paint8_linear_18_19843" x1="10.1887" y1="10.9375" x2="8.32225" y2="13.375" gradientUnits="userSpaceOnUse"> <stop offset="0.234399" stop-color="#D2C8DC"/> <stop offset="1" stop-color="#D2C8DC" stop-opacity="0"/> </linearGradient> <linearGradient id="nx32052_paint9_linear_18_19843" x1="10.9375" y1="21.25" x2="9.5" y2="18.9375" gradientUnits="userSpaceOnUse"> <stop stop-color="#C6B6D5"/> <stop offset="1" stop-color="#C6B6D5" stop-opacity="0"/> </linearGradient> <radialGradient id="nx32052_paint10_radial_18_19843" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(12.7544 16) scale(9.23183)"> <stop offset="0.62037" stop-color="#C9B9DB"/> <stop offset="0.899659" stop-color="#C7B8D4"/> </radialGradient> </defs> </svg>
Want to Improve or Restyle This Icon? Optical Disk
Generate a precise engineering prompt, or improve the icon on the canvas right now. Optical Disk
Library: Fluent UI Emoji | Author: Microsoft Corporation | License: MIT | No Sign-Up Required | 100% Browser-Based Processing
Optical Disk - Technical Vector Specifications
Source, author, and license are available in the preview and icon details. Optical Disk
| Canonical asset identifier | fluentui-emoji/fluentui-emoji-optical-disk |
|---|---|
| Source library pack | Fluent UI Emoji |
| Coordinate grid and viewBox | viewBox="0 0 32 32" |
| Uncompressed payload | 12,653 bytes (~6,959 bytes gzipped) |
| SPDX license and commercial use | MIT - Free for commercial use |
| Supported export targets | SVG, PNG (32px-2048px), WebP, ICO, React TSX, Vue 3, Svelte, Tailwind CSS, CSS Mask, Base64 |
| Security and privacy guarantee | No Sign-Up Required | 100% Browser-Based Processing |
How to Use and Customize This Icon: Optical Disk
- Customize visually: Color, Auto (Stroke and Fill), Stroke Width (
0.5px-4px), Live Vector Animation Presets - Download vector or raster: Download SVG, PNG (Transparent), WebP (Optimized) (
2048x2048 px) - Copy framework code: Copy ready code for React, Next.js, Vue 3, Svelte, Angular, HTML, and CSS masks.
- Deep vector editing: Edit in SVG Editor (76,166)
fluentui-emoji-optical-disk.svg aria-hidden="true" focusable="false"
More in 3D Vector Icons
BrowseMobile Phone With Arrow
Fluent UI Emoji|3d-iconsMobile Phone
Fluent UI Emoji|3d-iconsMoney Bag
Fluent UI Emoji|3d-iconsMoney Mouth Face
Fluent UI Emoji|3d-iconsMoney With Wings
Fluent UI Emoji|3d-iconsMonkey Face
Fluent UI Emoji|3d-iconsMonkey
Fluent UI Emoji|3d-iconsMonorail
Fluent UI Emoji|3d-iconsMoon Cake
Fluent UI Emoji|3d-iconsMoon Viewing Ceremony
Fluent UI Emoji|3d-iconsMoose
Fluent UI Emoji|3d-iconsExplore more
Optical Disk - Frequently Asked Questions
Is the Optical Disk SVG icon free for commercial use? +
Yes. The Optical Disk icon from the Fluent UI Emoji collection is licensed under MIT. You can use it free of charge in commercial websites, mobile apps, SaaS products, and print designs.
Does the Optical Disk icon keep its original default colors on download? +
Yes. By default, downloading Optical Disk keeps its original SVG colors and stroke settings untouched. If you pick a custom color or stroke width in the live editor, your downloaded file will include your custom changes.
How do I use the Optical Disk icon in React, Next.js, or Vue? +
Switch to the React TSX or Vue 3 tab on this page and click Copy SVG. Paste the component into your project and style it with standard CSS or Tailwind classes.
Can I download Optical Disk as a transparent PNG image? +
Yes. Choose your preferred size such as 64px, 128px, 256px, 512px, or 2048px and click Download PNG to render a high-resolution transparent PNG in your browser.
How do I animate the Optical Disk SVG icon with CSS? +
Click any animation button in the Live Editor such as Spin, Pulse, Bounce, Float, or Draw. The SVG code and download automatically include the matching CSS keyframes.
Can I generate an AI prompt for Optical Disk? +
Yes. Use the AI Icon Prompt Generator section on this page to create a tailored prompt for Optical Disk in 3D Clay, Glassmorphism, Neon, or Minimalist Vector style.
Can I resize the Optical Disk icon without losing quality? +
Yes. The Optical Disk file is a vector with a scalable viewBox, so it stays sharp at 16px, 64px, 512px, or any print size.
Where do I report a problem with the Optical Disk icon file? +
Write to support@svgnexus.com with the icon URL. License and takedown questions about Optical Disk go to legal@svgnexus.com.
SVG Editor
Edit paths, layers, colors, and animations in your browser, then export clean SVG, PNG, or framework code.