Home/Libraries/Cuida Icons (Iconify)/dashboard-outline

Cuida Icons (Iconify)

DashboardOutline

License: Apache-2.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 24 24"><path fill="#818cf8" fill-rule="evenodd" d="M4.825 11h3.38c.121 0 .32 0 .502.016c.225.02.609.076 1.015.303a2.5 2.5 0 0 1 .96.96c.226.405.282.789.302 1.014c.017.183.016.381.016.502v5.41c0 .121 0 .32-.016.502c-.02.225-.075.609-.303 1.015a2.5 2.5 0 0 1-.96.96a2.5 2.5 0 0 1-1.014.302C8.524 22 8.326 22 8.205 22h-3.41c-.12 0-.32 0-.502-.016a2.5 2.5 0 0 1-1.014-.303a2.5 2.5 0 0 1-.96-.96a2.5 2.5 0 0 1-.303-1.014C2 19.524 2 19.326 2 19.205v-5.41c0-.12 0-.32.016-.502c.02-.225.076-.609.303-1.014a2.5 2.5 0 0 1 .96-.96a2.5 2.5 0 0 1 1.014-.303C4.476 11 4.674 11 4.795 11zm-.761 2.256C4 13.37 4 13.52 4 13.826v5.35c0 .303 0 .455.064.568a.5.5 0 0 0 .192.192c.114.064.265.064.569.064h3.35c.304 0 .456 0 .57-.064a.5.5 0 0 0 .191-.192C9 19.631 9 19.48 9 19.175v-5.35c0-.304 0-.455-.064-.57a.5.5 0 0 0-.192-.191C8.631 13 8.48 13 8.175 13h-3.35c-.304 0-.455 0-.57.064a.5.5 0 0 0-.191.192M4.825 2h3.38c.121 0 .32 0 .502.016c.225.02.609.076 1.015.303a2.5 2.5 0 0 1 .96.96c.226.405.282.789.302 1.014c.017.183.016.381.016.502v2.41c0 .121 0 .32-.016.502c-.02.225-.075.609-.303 1.015a2.5 2.5 0 0 1-.96.96a2.5 2.5 0 0 1-1.014.302c-.183.017-.381.016-.502.016h-3.41c-.12 0-.32 0-.502-.016a2.5 2.5 0 0 1-1.014-.303a2.5 2.5 0 0 1-.96-.96a2.5 2.5 0 0 1-.303-1.014C2 7.524 2 7.326 2 7.205v-2.41c0-.12 0-.32.016-.502c.02-.225.076-.609.303-1.014a2.5 2.5 0 0 1 .96-.96a2.5 2.5 0 0 1 1.014-.303C4.476 2 4.674 2 4.795 2zm-.761 2.256C4 4.37 4 4.52 4 4.825v2.35c0 .304 0 .456.064.57a.5.5 0 0 0 .192.191C4.37 8 4.52 8 4.825 8h3.35c.304 0 .456 0 .57-.064a.5.5 0 0 0 .191-.192C9 7.631 9 7.48 9 7.175v-2.35c0-.304 0-.455-.064-.57a.5.5 0 0 0-.192-.191C8.631 4 8.48 4 8.175 4h-3.35c-.304 0-.455 0-.57.064a.5.5 0 0 0-.191.192M15.825 13h3.38c.121 0 .32 0 .502-.016c.225-.02.609-.075 1.015-.303a2.5 2.5 0 0 0 .96-.96c.227-.405.282-.789.302-1.014c.016-.183.016-.381.016-.502v-5.41c0-.12 0-.32-.016-.502a2.5 2.5 0 0 0-.303-1.014a2.5 2.5 0 0 0-.96-.96a2.5 2.5 0 0 0-1.014-.303C19.524 2 19.326 2 19.205 2h-3.41c-.12 0-.32 0-.502.016c-.225.02-.609.076-1.014.303a2.5 2.5 0 0 0-.96.96a2.5 2.5 0 0 0-.303 1.014C13 4.476 13 4.674 13 4.795v5.41c0 .121 0 .32.016.502c.02.225.076.609.303 1.015a2.5 2.5 0 0 0 .96.96c.405.226.789.282 1.014.302c.183.017.381.016.502.016zm-.761-2.256C15 10.63 15 10.48 15 10.175v-5.35c0-.304 0-.455.064-.57a.5.5 0 0 1 .192-.191C15.37 4 15.52 4 15.826 4h3.35c.303 0 .455 0 .568.064a.5.5 0 0 1 .192.192c.064.114.064.265.064.569v5.35c0 .304 0 .455-.064.57a.5.5 0 0 1-.192.191c-.113.064-.265.064-.569.064h-3.35c-.304 0-.455 0-.57-.064a.5.5 0 0 1-.191-.192M15.825 22h3.38c.121 0 .32 0 .502-.016c.225-.02.609-.076 1.015-.303a2.5 2.5 0 0 0 .96-.96c.227-.405.282-.789.302-1.014c.016-.183.016-.381.016-.502v-2.41c0-.12 0-.32-.016-.502a2.5 2.5 0 0 0-.303-1.014a2.5 2.5 0 0 0-.96-.96a2.5 2.5 0 0 0-1.014-.303C19.524 14 19.326 14 19.205 14h-3.41c-.12 0-.32 0-.502.016c-.225.02-.609.076-1.014.303a2.5 2.5 0 0 0-.96.96a2.5 2.5 0 0 0-.303 1.014c-.016.183-.016.381-.016.502v2.41c0 .121 0 .32.016.502c.02.225.076.609.303 1.015a2.5 2.5 0 0 0 .96.96c.405.227.789.282 1.014.302c.183.016.381.016.502.016zm-.761-2.256C15 19.631 15 19.48 15 19.175v-2.35c0-.304 0-.455.064-.57a.5.5 0 0 1 .192-.191c.114-.064.265-.064.57-.064h3.35c.303 0 .455 0 .568.064c.08.045.147.111.192.192c.064.114.064.265.064.57v2.35c0 .303 0 .455-.064.568a.5.5 0 0 1-.192.192c-.113.064-.265.064-.569.064h-3.35c-.304 0-.455 0-.57-.064a.5.5 0 0 1-.191-.192" clip-rule="evenodd"/></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. DashboardOutlineIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

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