Home/Libraries/SVG Logos (Iconify)/concrete5

SVG Logos (Iconify)

Concrete5

License: CC0-1.0Commercial 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 256 256"><defs><linearGradient id="svgIDa" x1="49.98%" x2="49.98%" y1="0%" y2="99.958%"><stop offset="0%" stop-color="#7A7A7A"/><stop offset="100%"/></linearGradient><linearGradient id="svgIDc" x1="49.998%" x2="49.998%" y1="-.025%" y2="100.005%"><stop offset="0%" stop-color="#FFF"/><stop offset="21.82%" stop-color="#FCFCFC"/><stop offset="35.38%" stop-color="#F4F4F4"/><stop offset="46.71%" stop-color="#E5E5E5"/><stop offset="56.79%" stop-color="#D1D1D1"/><stop offset="66.05%" stop-color="#B6B6B6"/><stop offset="74.72%" stop-color="#959595"/><stop offset="82.92%" stop-color="#6E6E6E"/><stop offset="90.75%" stop-color="#414141"/><stop offset="98.03%" stop-color="#0F0F0F"/><stop offset="100%"/></linearGradient><linearGradient id="svgIDd" x1="50%" x2="50%" y1=".121%" y2="99.902%"><stop offset="0%" stop-color="#FFF"/><stop offset=".587%" stop-color="#F7F7F7"/><stop offset="3.628%" stop-color="#D3D3D3"/><stop offset="7.049%" stop-color="#B2B2B2"/><stop offset="10.83%" stop-color="#979797"/><stop offset="15.1%" stop-color="#818181"/><stop offset="20.09%" stop-color="#707070"/><stop offset="26.25%" stop-color="#646464"/><stop offset="34.9%" stop-color="#5E5E5E"/><stop offset="58.92%" stop-color="#5C5C5C"/></linearGradient><linearGradient id="svgIDe" x1="49.998%" x2="49.998%" y1=".007%" y2="99.99%"><stop offset="0%"/><stop offset="27.57%" stop-color="#666"/><stop offset="31.35%"/><stop offset="62.16%" stop-color="#404040"/><stop offset="94.05%" stop-color="#383838"/><stop offset="100%"/></linearGradient><radialGradient id="svgIDb" cx="49.252%" cy="67.581%" r="62.337%" fx="49.252%" fy="67.581%"><stop offset="0%" stop-color="#FFF"/><stop offset="65.316%" stop-color="#6B6B6B"/><stop offset="100%"/></radialGradient></defs><path fill="url(#svgIDa)" d="M220.738 0H34.266C15.34 0 0 15.34 0 34.266v186.571c0 18.926 15.34 34.267 34.266 34.267h186.571c18.926 0 34.267-15.34 34.267-34.267V34.267C255.004 15.34 239.664 0 220.738 0Z"/><path fill="#818cf8" d="M219.94 1.096H34.964c-18.726 0-33.867 15.14-33.867 33.867v184.978c0 18.727 15.24 33.967 33.967 33.967H220.04c18.727 0 33.968-15.24 33.968-33.967V34.963c-.1-18.726-15.24-33.867-34.067-33.867Z"/><path fill="url(#svgIDb)" d="M244.246 215.26c0 17.331-14.045 31.277-31.278 31.277H42.335c-17.333 0-31.278-14.045-31.278-31.278V44.725c0-17.332 14.045-31.278 31.278-31.278h170.533c17.333 0 31.278 14.046 31.278 31.278V215.26h.1Z" opacity=".3"/><path fill="url(#svgIDc)" d="M213.665 9.563H41.34c-17.532 0-31.677 14.144-31.677 31.576v62.357c34.167 9.363 74.51 14.842 117.84 14.842c43.231 0 83.673-5.479 117.84-14.842V41.139c0-17.432-14.145-31.576-31.677-31.576Z" opacity=".3"/><path fill="url(#svgIDd)" d="M41.339 18.826h172.326c17.432 0 31.577 14.145 31.577 31.577V41.04c0-17.432-14.145-31.577-31.577-31.577H41.34c-17.432 0-31.577 14.244-31.577 31.676v9.364c0-17.532 14.145-31.677 31.577-31.677Z" opacity=".64"/><path fill="url(#svgIDe)" d="M39.546 248.928c-18.528 0-33.47-14.942-33.47-33.47V39.546c0-18.528 14.942-33.47 33.47-33.47h175.912c18.528 0 33.47 14.942 33.47 33.47v175.912c0 18.528-14.942 33.47-33.47 33.47H39.546ZM8.466 39.546v175.912c0 17.133 13.946 31.079 31.08 31.079h175.912c17.133 0 31.079-13.946 31.079-31.079V39.546c0-17.134-13.946-31.08-31.079-31.08H39.546c-17.134 0-31.08 13.946-31.08 31.08Z"/><path fill="#818cf8" d="M215.458 249.525H39.546c-18.827 0-34.067-15.34-34.067-34.067V39.546c0-18.827 15.34-34.067 34.067-34.067h175.912c18.827 0 34.067 15.34 34.067 34.067v175.912c0 18.827-15.24 34.067-34.067 34.067ZM39.546 6.674c-18.13 0-32.872 14.742-32.872 32.872v175.912c0 18.13 14.742 32.872 32.872 32.872h175.912c18.13 0 32.872-14.742 32.872-32.872V39.546c0-18.13-14.742-32.872-32.872-32.872H39.546Zm175.912 240.46H39.546c-17.432 0-31.677-14.244-31.677-31.676V39.546c0-17.432 14.245-31.677 31.677-31.677h175.912c17.432 0 31.677 14.245 31.677 31.677v175.912c0 17.432-14.245 31.677-31.677 31.677ZM9.065 39.547v175.912c0 16.735 13.646 30.382 30.48 30.481h175.913c16.735 0 30.481-13.646 30.481-30.48V39.545c0-16.735-13.646-30.382-30.48-30.481H39.545c-16.735.1-30.382 13.746-30.481 30.48Z"/><path fill="#818cf8" d="M207.689 154.995c-18.329-21.815-46.419 24.205-61.56 34.066c-10.459 6.874-26.397 7.372-37.553.897c-15.24-8.965-10.559-30.481 5.478-35.76c14.344-4.782 39.446 10.36 48.511-4.782c11.256-18.627-27.094-23.01-38.45-22.512c-20.42.797-40.143 7.471-52.196 22.91c-13.049 16.636-10.06 36.757 4.283 51.898c14.643 14.145 35.86 19.623 57.077 17.93c5.38-.398 14.544-2.69 21.516-6.574c13.946-7.67 56.58-53.69 52.894-58.073ZM73.91 138.758c7.073 1.395-6.674-38.151-7.57-43.63c-1.096-6.574-3.487-15.838-10.06-16.834c-7.571-1.096-9.663 7.57-8.169 15.141c1.793 7.77 19.225 43.928 25.8 45.323Zm58.671-20.52c10.957 1.594 10.26-51.1 10.26-58.272c0-6.475 2.49-24.305-6.176-25.9c-11.953-2.29-13.148 13.448-13.348 21.816c.399 8.467-2.191 60.762 9.264 62.356Zm26.098 8.467c11.953 4.98 21.118-48.212 22.512-54.985c1.295-6.973 1.594-21.715-10.36-17.034c-5.976 2.391-7.072 12.053-7.968 17.432c-1.494 6.674-13.448 50.702-4.184 54.587Zm-57.675-4.482c13.548.996.797-52.495-.298-59.667c-1.096-7.272-5.977-21.815-16.038-13.348c-5.08 4.283-2.789 14.145-1.793 19.723c.897 7.172 7.77 52.495 18.13 53.292Z"/></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. Concrete5Icon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC0-1.0** 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.