Home/Libraries/VSCode Icons (Iconify)/file-type-marko

VSCode Icons (Iconify)

FileTypeMarko

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 32 32"><defs><linearGradient id="SVGGp101RZD" x1="14.834" x2="14.834" y1="16.002" y2="11.058" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8ac23e"/><stop offset="1" stop-color="#8ac23e" stop-opacity="0"/></linearGradient><linearGradient id="SVGHgVmtcsE" x1="16.475" x2="16.475" y1="8.375" y2="13.319" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#698932"/><stop offset="1" stop-color="#698932" stop-opacity="0"/></linearGradient><linearGradient id="SVGHXvOKbaO" x1="19.504" x2="19.504" y1="8.375" y2="13.319" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffed01"/><stop offset="1" stop-color="#ffed01" stop-opacity="0"/></linearGradient><linearGradient id="SVGKhK2dekR" x1="24.861" x2="24.861" y1="8.375" y2="13.32" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e02a89"/><stop offset="1" stop-color="#e02a89" stop-opacity="0"/></linearGradient><linearGradient id="SVGiEsVge6f" x1="26.508" x2="26.508" y1="16.002" y2="20.945" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#7f1e4f"/><stop offset="1" stop-color="#7f1e4f" stop-opacity="0"/></linearGradient><linearGradient id="SVGLtWSqbGi" x1="21.149" x2="21.149" y1="16.002" y2="20.945" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e95506"/><stop offset="1" stop-color="#e95506" stop-opacity="0"/></linearGradient><linearGradient id="SVGz5dVCmNs" x1="5.487" x2="5.487" y1="16.002" y2="11.061" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#88d0f1"/><stop offset="1" stop-color="#88d0f1" stop-opacity="0"/></linearGradient><linearGradient id="SVGgQafgW0G" x1="-357.383" x2="-357.383" y1="-453.915" y2="-458.855" gradientTransform="matrix(-1 0 0 -1 -350.252 -445.54)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#00828b"/><stop offset=".833" stop-color="#00828b" stop-opacity="0"/></linearGradient><linearGradient id="SVG4SMate4C" x1="7.13" x2="7.13" y1="23.628" y2="18.689" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2073ba"/><stop offset="1" stop-color="#2073ba" stop-opacity="0"/></linearGradient><linearGradient id="SVGJEiuBcMd" x1="10.161" x2="10.161" y1="8.375" y2="13.315" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8ed0e1"/><stop offset="1" stop-color="#88d0f1" stop-opacity="0"/></linearGradient></defs><path fill="#818cf8" fill-rule="evenodd" d="M16.014 8.375h3.948c-1.455 2.38-3.062 5-4.668 7.627h-3.951c1.607-2.622 3.213-5.247 4.671-7.627"/><path fill="#818cf8" fill-rule="evenodd" d="M6.67 8.375h3.951q-1.172 1.91-2.338 3.816T5.948 16l2.332 3.817q1.164 1.906 2.338 3.81h-3.95q-1.172-1.9-2.338-3.81T2 16l2.332-3.81Q5.5 10.28 6.67 8.375"/><path fill="#818cf8" fill-rule="evenodd" d="M6.669 8.372C8.278 11 9.888 13.622 11.344 16h3.951l-4.674-7.625Z"/><path fill="#818cf8" fill-rule="evenodd" d="M19.962 8.375h-3.948l2.335 3.816q1.167 1.906 2.338 3.809q-1.172 1.911-2.338 3.817l-2.335 3.81h3.951q1.168-1.9 2.335-3.81T24.638 16c-.784-1.269-1.559-2.538-2.338-3.81s-1.56-2.54-2.338-3.815"/><path fill="url(#SVGGp101RZD)" fill-rule="evenodd" d="M18.326 11.058h-3.954l-1.512 2.471Q12.1 14.765 11.343 16h3.951l1.52-2.474q.76-1.236 1.512-2.468"/><path fill="url(#SVGHgVmtcsE)" fill-rule="evenodd" d="M12.987 13.319h3.951l1.512-2.471l1.512-2.473h-3.948q-.76 1.238-1.515 2.473Z"/><path fill="url(#SVGHXvOKbaO)" fill-rule="evenodd" d="M22.994 13.319h-3.95l-1.518-2.471l-1.512-2.473h3.948q.756 1.238 1.515 2.473c.505.822 1.011 1.652 1.517 2.471"/><path fill="#818cf8" fill-rule="evenodd" d="M25.321 8.375H21.37l2.332 3.816q1.164 1.903 2.342 3.809q-1.172 1.911-2.338 3.817t-2.335 3.81h3.951q1.168-1.9 2.335-3.81T29.994 16l-2.338-3.81q-1.168-1.902-2.335-3.815"/><path fill="url(#SVGKhK2dekR)" fill-rule="evenodd" d="M28.351 13.32H24.4q-.764-1.233-1.518-2.471T21.37 8.375h3.951l1.512 2.474q.756 1.236 1.518 2.471"/><path fill="url(#SVGiEsVge6f)" fill-rule="evenodd" d="M23.017 20.945h3.951q.756-1.233 1.512-2.47T30 16h-3.956q-.76 1.238-1.515 2.473Z"/><path fill="url(#SVGLtWSqbGi)" fill-rule="evenodd" d="M17.66 20.945h3.951l1.512-2.471l1.515-2.473h-3.951q-.76 1.238-1.515 2.473Z"/><path fill="url(#SVGz5dVCmNs)" fill-rule="evenodd" d="M8.975 11.063H5.024q-.76 1.237-1.515 2.473C2.754 14.772 2.5 15.181 2 16h3.948c.5-.821 1.008-1.646 1.512-2.468s1.008-1.646 1.515-2.469"/><path fill="url(#SVGgQafgW0G)" fill-rule="evenodd" d="M3.644 13.314h3.95q.76-1.237 1.515-2.473c.755-1.236 1.008-1.641 1.51-2.466H6.67c-.5.821-1.008 1.646-1.512 2.468s-1.007 1.647-1.514 2.471"/><path fill="url(#SVG4SMate4C)" fill-rule="evenodd" d="M3.641 18.691h3.951c.5.825 1.008 1.649 1.512 2.471s1.008 1.647 1.515 2.468H6.668q-.761-1.23-1.518-2.468c-.505-.822-1.005-1.648-1.509-2.471"/><path fill="url(#SVGJEiuBcMd)" fill-rule="evenodd" d="M13.648 13.314H9.7q-.76-1.237-1.515-2.473C7.43 9.605 7.174 9.2 6.673 8.375h3.948c.5.821 1.008 1.646 1.512 2.468s1.008 1.647 1.515 2.471"/></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. FileTypeMarkoIcon.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.