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-interceptors | |
folder-ios | |
folder-layout | |
folder-mail | |
folder-middleware | |
folder-models | |
folder-modules | |
folder-orange-code | |
folder-orange-outline | |
folder-orange | |
folder-prisma | |
folder-pipes | |
folder-purple-code | |
folder-purple-outline | |
folder-purple | |
folder-providers | |
folder-red-code | |
folder-red-outline | |
folder-red | |
folder-reducer | |
folder-router | |
folder-selector | |
folder-services | |
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 | |
func | func |
fresh | |
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 | |
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-types | |
ts-test | |
ts | |
tsconfig | |
turborepo | |
twig | |
unocss | |
v | |
vanilla-extract | |
vercel | |
video | |
visual-studio | |
vite | |
vitest | |
vue | |
webpack | |
xml | |
yaml | |
yarn | |
zig | |
zip |