A file icon for VS Code
If you'd like to contribute to this extension, please take a look at the issues or create a new one. If you'd like to create a new icon, please reference the Symbols - File Icon Figma file, you can make a copy or reference the styles used (tailwind). Please try to limit your colors to the ones used in existing icons before choosing a different color style.
When submitting a PR, please ensure you've tested the extension locally and ensure that your new icons appear correctly in the file tree view with your new file extension. Include a screenshot of your proposed icon in your PR.
You can configure which folders and files icons are displayed by using the following settings:
"symbols.folders.associations": {
"{folder name}": "{icon name}"
}
And here is an example using this setting:
"symbols.folders.associations": {
"entities": "folder-assets",
"infra": "folder-app",
"schemas": "folder-purple"
}
"symbols.files.associations": {
"{file name}": "{icon name}"
}
And here is an example:
"symbols.files.associations": {
"app.module.ts": "nest",
"*.service.ts": "nest"
}
Note: For file names, you can use *
to match all files with a specific file extension.
You can choose which icons to use from the Library:
Preview
Name |
Preview |
folder-android |
|
folder-actions |
|
folder-angular |
|
folder-app |
|
folder-assets |
|
folder-auth |
|
folder-blue-code |
|
folder-blue-outline |
|
folder-blue |
|
folder-config |
|
folder-context |
|
folder-core |
|
folder-database |
|
folder-drizzle |
|
folder-effects |
|
folder-facade |
|
folder-firebase |
|
folder-github |
|
folder-gray-code |
|
folder-gray-outline |
|
folder-gray |
|
folder-green-code |
|
folder-green-outline |
|
folder-green |
|
folder-helpers |
|
folder-images |
|
folder-intefaces |
|
folder-ios |
|
folder-layout |
|
folder-mail |
|
folder-middleware |
|
folder-models |
|
folder-modules |
|
folder-orange-code |
|
folder-orange-outline |
|
folder-orange |
|
folder-prisma |
|
folder-purple-code |
|
folder-purple-outline |
|
folder-purple |
|
folder-red-code |
|
folder-red-outline |
|
folder-red |
|
folder-reducer |
|
folder-router |
|
folder-selector |
|
folder-shared |
|
folder-sky-code |
|
folder-sky-outline |
|
folder-sky |
|
folder-supabase |
|
folder-target |
|
folder-tina |
|
folder-utils |
|
folder-vercel |
|
folder-yellow-code |
|
folder-yellow-outline |
|
folder-yellow |
|
folder |
|
angular-component |
|
angular-service |
|
angular |
|
astro |
|
audio |
|
babel |
|
biome |
|
brackets-blue |
|
brackets-gray |
|
brackets-green |
|
brackets-orange |
|
brackets-purple |
|
brackets-red |
|
brackets-sky |
|
brackets-yellow |
|
bun |
|
c |
|
capacitor |
|
clojure |
|
cloudflare-workers |
|
cmake |
|
code-blue |
|
code-gray |
|
code-green |
|
code-orange |
|
code-purple |
|
code-red |
|
code-sky |
|
code-yellow |
|
coffeescript |
|
coldfusion |
|
contentlayer |
|
cplus |
|
crystal |
|
csharp |
|
csv |
|
cucumber |
|
cypress |
|
dart |
|
database |
|
deno |
|
docker |
|
document |
|
drawio |
|
drizzle |
|
dts |
|
dune |
|
earthfile |
|
editorconfig |
|
elixir |
|
erlang |
|
eslint |
|
exe |
|
expressive-code |
|
firebase |
|
font |
|
fsharp |
|
gatsby |
|
gear |
|
gif |
|
git |
|
github |
|
gleam |
|
go-mod |
|
go |
|
gradle |
|
graphql |
|
gulp |
|
h |
|
haml |
|
haskell |
|
http |
|
hugo |
|
i18n |
|
ignore |
|
image |
|
ionic |
|
java |
|
jenkins |
|
jest |
|
js-test |
|
js |
|
julia-markdown |
|
julia |
|
keystatic |
|
knip |
|
kotlin |
|
laravel |
|
license |
|
liquid |
|
lock |
|
lua |
|
lunaria |
|
markdoc |
|
markdown |
|
mdx |
|
minecraft |
|
nest |
|
nest-controller |
|
nest-service |
|
netlify |
|
next |
|
nix |
|
node |
|
nodemon |
|
notebook |
|
npm |
|
nunjucks |
|
nuxt |
|
ocaml |
|
panda |
|
patch |
|
pdf |
|
perl |
|
php |
|
pkl |
|
pnpm |
|
postcss |
|
prettier |
|
prisma |
|
proto |
|
pug |
|
pulumi |
|
puzzle |
|
python |
|
r |
|
razor |
|
react-test |
|
react-ts |
|
react |
|
redux-actions |
|
redux-effects |
|
redux-facade |
|
redux-reducer |
|
redux-selector |
|
rescript-interface |
|
rescript |
|
robot |
|
rome |
|
ruby |
|
rust |
|
sanity |
|
sass |
|
sbt |
|
scala |
|
severless |
|
shell |
|
solidity |
|
storybook |
|
stylelint |
|
stylus |
|
supabase |
|
svelte |
|
svelte-ts |
|
svg |
|
svx |
|
swc |
|
swift |
|
tailwind |
|
target |
|
terraform |
|
tex |
|
text |
|
ts-test |
|
ts |
|
tsconfig |
|
turborepo |
|
twig |
|
unocss |
|
v |
|
vanilla-extract |
|
vercel |
|
video |
|
visual-studio |
|
vite |
|
vitest |
|
vue |
|
webpack |
|
xml |
|
yaml |
|
yarn |
|
zig |
|
zip |
|