Home/Libraries/Devicon (Iconify)/d3js

Devicon (Iconify)

D3js

License: MITCommercial Safe

ICON SIZE

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 128 128"><linearGradient id="SVGjrCCbctZ" x1="-201.009" x2="-200.098" y1="376.844" y2="375.873" gradientTransform="matrix(82.4907 0 0 -81.4303 16634.416 30700.326)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f9a03c"/><stop offset="1" stop-color="#f7974e"/></linearGradient><path fill="url(#SVGjrCCbctZ)" d="M126.334 90.59a37 37 0 0 0 .128-1.647C126.5 88.288 87.094 50.9 87.094 50.9h-.942s39.94 42.13 40.182 39.69"/><linearGradient id="SVGPJJkOJhY" x1="-199.257" x2="-197.514" y1="373.615" y2="371.916" gradientTransform="matrix(40.2105 0 0 -40.4122 8003.203 15127)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f9a03c"/><stop offset="1" stop-color="#f7974e"/></linearGradient><path fill="url(#SVGPJJkOJhY)" d="M42.26 77.62a26 26 0 0 1-.328.702c-1.256 2.62 17.585 21.038 19.1 18.8c.07-.098.14-.202.208-.3c.077-.118.152-.23.228-.348c1.213-1.84-18.67-20.05-19.207-18.854z"/><linearGradient id="SVG5IrXTdwB" x1="-199.836" x2="-198.286" y1="374.252" y2="372.475" gradientTransform="matrix(41.0403 0 0 -39.9333 8224.5 14997.683)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f9a03c"/><stop offset="1" stop-color="#f7974e"/></linearGradient><path fill="url(#SVG5IrXTdwB)" d="M68.886 103.52c-.053.118-.433.76-.78 1.098c-.058.117 18.394 18.417 18.394 18.417h1.66c.002 0-17.32-18.74-19.274-19.514z"/><linearGradient id="SVGMKLcOc0X" x1="-201.143" x2="-200.795" y1="379.263" y2="378.804" gradientTransform="matrix(255.8347 0 0 -242.016 51476.605 91789.102)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f26d58"/><stop offset="1" stop-color="#f9a03c"/></linearGradient><path fill="url(#SVGMKLcOc0X)" d="M126.488 88.61c-.863 19.13-16.69 34.425-36.024 34.425H87.85l-19.31-19.022a69 69 0 0 0 4.38-6.98h17.544c5.55 0 10.064-4.514 10.064-10.065s-4.515-10.064-10.064-10.064H80.082A69.4 69.4 0 0 0 81.306 64c0-4.48-.44-8.852-1.26-13.1h6.45l39.88 39.295a49 49 0 0 0 .112-1.585M11.962 4.772H1.472v26.003h10.49c18.32 0 33.23 14.903 33.23 33.225c0 4.984-1.113 9.716-3.088 13.964L61.24 96.82A58.9 58.9 0 0 0 71.2 64c0-32.658-26.574-59.228-59.236-59.228z"/><linearGradient id="SVGwqHbMeNX" x1="-200.962" x2="-200.452" y1="378.553" y2="378.218" gradientTransform="matrix(160.7307 0 0 -174.8133 32360.78 66184.883)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#b84e51"/><stop offset="1" stop-color="#f68e48"/></linearGradient><path fill="url(#SVGwqHbMeNX)" d="M90.464 4.772H47.986a69.8 69.8 0 0 1 24.82 26.003h17.658c5.55 0 10.064 4.513 10.064 10.064c0 5.55-4.515 10.06-10.064 10.06h-3.968l39.88 39.296a37 37 0 0 0 .152-3.228c0-8.766-3.146-16.807-8.368-23.066c5.223-6.256 8.368-14.3 8.368-23.063c0-19.887-16.177-36.068-36.064-36.068z"/><linearGradient id="SVG0hif7blj" x1="-200.619" x2="-200.595" y1="377.137" y2="376.532" gradientTransform="matrix(176.7653 0 0 -92.6293 35504.598 35022.56)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f9a03c"/><stop offset="1" stop-color="#f7974e"/></linearGradient><path fill="url(#SVG0hif7blj)" d="M87.85 123.035H48.29a69.95 69.95 0 0 0 20.25-19.022zM61.24 96.82L42.106 77.965c-5.287 11.362-16.807 19.264-30.143 19.264H1.472v26h10.49c20.53 0 38.648-10.5 49.28-26.407z"/></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px

16px

24px

32px

48px

“

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. D3jsIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **MIT** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.