folder type story opened logo

folder-type-story-opened from VSCode Icons by Roberto Huertas · Color · MIT Free for personal and commercial use.

Name
folder-type-story-opened
Set
VSCode Icons
Style
Color
Viewbox
32×32
License
MIT

Related icons in VSCode Icons

Use the folder type story opened logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#db7b96" d="M27.9 6h-9.7l-2 4H5v4H.3l3.8 13H30V6Zm-6.6 2H28l.1 2h-7.8Zm4.6 6H7v-2h21v9.184Z"/><path fill="#fff" d="m26.817 13.461l.093-2.267l1.921-.12l.086 2.307a.15.15 0 0 1-.033.1a.146.146 0 0 1-.208.024l-.741-.586l-.878.668a.15.15 0 0 1-.21-.027a.14.14 0 0 1-.03-.099"/><path fill="#ff4785" d="m26.91 11.194l-.093 2.267a.15.15 0 0 0 .03.1a.15.15 0 0 0 .209.03l.877-.668l.742.586a.147.147 0 0 0 .209-.017a.16.16 0 0 0 .033-.1l-.092-2.307L29.937 11a1 1 0 0 1 1.063.944v18.05A1 1 0 0 1 30 31h-.047l-13.378-.6a1 1 0 0 1-.957-.968L15 12.923a1 1 0 0 1 .939-1.041l10.97-.688Z"/><path fill="#fff" d="M24.358 18.54c0 .391 2.627.2 2.98-.071c0-2.664-1.425-4.064-4.035-4.064s-4.071 1.421-4.071 3.554c0 3.713 5 3.785 5 5.81a.8.8 0 0 1-.681.906a.8.8 0 0 1-.207 0c-.8 0-1.111-.408-1.074-1.794c0-.3-3.036-.4-3.127 0c-.236 3.357 1.85 4.328 4.236 4.328c2.313 0 4.127-1.237 4.127-3.476c0-3.981-5.071-3.873-5.071-5.846a.84.84 0 0 1 .759-.911a.8.8 0 0 1 .185 0c.368.006 1.035.071.979 1.564"/></svg>

React

import type { SVGProps } from "react";

export function VscodeIconsFolderTypeStoryOpened(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#db7b96" d="M27.9 6h-9.7l-2 4H5v4H.3l3.8 13H30V6Zm-6.6 2H28l.1 2h-7.8Zm4.6 6H7v-2h21v9.184Z"/><path fill="#fff" d="m26.817 13.461l.093-2.267l1.921-.12l.086 2.307a.15.15 0 0 1-.033.1a.146.146 0 0 1-.208.024l-.741-.586l-.878.668a.15.15 0 0 1-.21-.027a.14.14 0 0 1-.03-.099"/><path fill="#ff4785" d="m26.91 11.194l-.093 2.267a.15.15 0 0 0 .03.1a.15.15 0 0 0 .209.03l.877-.668l.742.586a.147.147 0 0 0 .209-.017a.16.16 0 0 0 .033-.1l-.092-2.307L29.937 11a1 1 0 0 1 1.063.944v18.05A1 1 0 0 1 30 31h-.047l-13.378-.6a1 1 0 0 1-.957-.968L15 12.923a1 1 0 0 1 .939-1.041l10.97-.688Z"/><path fill="#fff" d="M24.358 18.54c0 .391 2.627.2 2.98-.071c0-2.664-1.425-4.064-4.035-4.064s-4.071 1.421-4.071 3.554c0 3.713 5 3.785 5 5.81a.8.8 0 0 1-.681.906a.8.8 0 0 1-.207 0c-.8 0-1.111-.408-1.074-1.794c0-.3-3.036-.4-3.127 0c-.236 3.357 1.85 4.328 4.236 4.328c2.313 0 4.127-1.237 4.127-3.476c0-3.981-5.071-3.873-5.071-5.846a.84.84 0 0 1 .759-.911a.8.8 0 0 1 .185 0c.368.006 1.035.071.979 1.564"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#db7b96" d="M27.9 6h-9.7l-2 4H5v4H.3l3.8 13H30V6Zm-6.6 2H28l.1 2h-7.8Zm4.6 6H7v-2h21v9.184Z"/><path fill="#fff" d="m26.817 13.461l.093-2.267l1.921-.12l.086 2.307a.15.15 0 0 1-.033.1a.146.146 0 0 1-.208.024l-.741-.586l-.878.668a.15.15 0 0 1-.21-.027a.14.14 0 0 1-.03-.099"/><path fill="#ff4785" d="m26.91 11.194l-.093 2.267a.15.15 0 0 0 .03.1a.15.15 0 0 0 .209.03l.877-.668l.742.586a.147.147 0 0 0 .209-.017a.16.16 0 0 0 .033-.1l-.092-2.307L29.937 11a1 1 0 0 1 1.063.944v18.05A1 1 0 0 1 30 31h-.047l-13.378-.6a1 1 0 0 1-.957-.968L15 12.923a1 1 0 0 1 .939-1.041l10.97-.688Z"/><path fill="#fff" d="M24.358 18.54c0 .391 2.627.2 2.98-.071c0-2.664-1.425-4.064-4.035-4.064s-4.071 1.421-4.071 3.554c0 3.713 5 3.785 5 5.81a.8.8 0 0 1-.681.906a.8.8 0 0 1-.207 0c-.8 0-1.111-.408-1.074-1.794c0-.3-3.036-.4-3.127 0c-.236 3.357 1.85 4.328 4.236 4.328c2.313 0 4.127-1.237 4.127-3.476c0-3.981-5.071-3.873-5.071-5.846a.84.84 0 0 1 .759-.911a.8.8 0 0 1 .185 0c.368.006 1.035.071.979 1.564"/></svg>
</template>

CSS

.icon-folder-type-story-opened {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23db7b96%22%20d%3D%22M27.9%206h-9.7l-2%204H5v4H.3l3.8%2013H30V6Zm-6.6%202H28l.1%202h-7.8Zm4.6%206H7v-2h21v9.184Z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m26.817%2013.461l.093-2.267l1.921-.12l.086%202.307a.15.15%200%200%201-.033.1a.146.146%200%200%201-.208.024l-.741-.586l-.878.668a.15.15%200%200%201-.21-.027a.14.14%200%200%201-.03-.099%22%2F%3E%3Cpath%20fill%3D%22%23ff4785%22%20d%3D%22m26.91%2011.194l-.093%202.267a.15.15%200%200%200%20.03.1a.15.15%200%200%200%20.209.03l.877-.668l.742.586a.147.147%200%200%200%20.209-.017a.16.16%200%200%200%20.033-.1l-.092-2.307L29.937%2011a1%201%200%200%201%201.063.944v18.05A1%201%200%200%201%2030%2031h-.047l-13.378-.6a1%201%200%200%201-.957-.968L15%2012.923a1%201%200%200%201%20.939-1.041l10.97-.688Z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M24.358%2018.54c0%20.391%202.627.2%202.98-.071c0-2.664-1.425-4.064-4.035-4.064s-4.071%201.421-4.071%203.554c0%203.713%205%203.785%205%205.81a.8.8%200%200%201-.681.906a.8.8%200%200%201-.207%200c-.8%200-1.111-.408-1.074-1.794c0-.3-3.036-.4-3.127%200c-.236%203.357%201.85%204.328%204.236%204.328c2.313%200%204.127-1.237%204.127-3.476c0-3.981-5.071-3.873-5.071-5.846a.84.84%200%200%201%20.759-.911a.8.8%200%200%201%20.185%200c.368.006%201.035.071.979%201.564%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23db7b96%22%20d%3D%22M27.9%206h-9.7l-2%204H5v4H.3l3.8%2013H30V6Zm-6.6%202H28l.1%202h-7.8Zm4.6%206H7v-2h21v9.184Z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m26.817%2013.461l.093-2.267l1.921-.12l.086%202.307a.15.15%200%200%201-.033.1a.146.146%200%200%201-.208.024l-.741-.586l-.878.668a.15.15%200%200%201-.21-.027a.14.14%200%200%201-.03-.099%22%2F%3E%3Cpath%20fill%3D%22%23ff4785%22%20d%3D%22m26.91%2011.194l-.093%202.267a.15.15%200%200%200%20.03.1a.15.15%200%200%200%20.209.03l.877-.668l.742.586a.147.147%200%200%200%20.209-.017a.16.16%200%200%200%20.033-.1l-.092-2.307L29.937%2011a1%201%200%200%201%201.063.944v18.05A1%201%200%200%201%2030%2031h-.047l-13.378-.6a1%201%200%200%201-.957-.968L15%2012.923a1%201%200%200%201%20.939-1.041l10.97-.688Z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M24.358%2018.54c0%20.391%202.627.2%202.98-.071c0-2.664-1.425-4.064-4.035-4.064s-4.071%201.421-4.071%203.554c0%203.713%205%203.785%205%205.81a.8.8%200%200%201-.681.906a.8.8%200%200%201-.207%200c-.8%200-1.111-.408-1.074-1.794c0-.3-3.036-.4-3.127%200c-.236%203.357%201.85%204.328%204.236%204.328c2.313%200%204.127-1.237%204.127-3.476c0-3.981-5.071-3.873-5.071-5.846a.84.84%200%200%201%20.759-.911a.8.8%200%200%201%20.185%200c.368.006%201.035.071.979%201.564%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/vscode-icons/folder-type-story-opened.svg?color=%231a73e8&size=48