How do I customize file icons colors in Atom?

Edit your stylesheet with CSS classes; for example, define custom shades of orange in a .less file as shown in the README, referencing the colours.less file for guidance.

File Icons Atom package not updating icons after install?

This is often a caching issue. Run the 'file-icons:clear-cache' command from the palette or restart Atom. If persists, check for conflicting packages like language-ethereum.

Can I use File Icons in VS Code or other editors?

No, File Icons is specific to Atom. For VS Code, look for extensions like vscode-icons. The package's API and integration are built around Atom's ecosystem only.

How to add custom icons for a specific file extension?

Use CSS attribute selectors in your stylesheet. Target files by extension, e.g., [data-name$='.js'], and assign icons from supported sets like Devicons, as demonstrated in the README examples.

File Icons vs atom-file-icons or other icon packages?

File Icons is the original package with broader support for core Atom packages and an API for extensions. Alternatives might offer different icon sets or lighter features; compare based on your integration needs.

Why are my Ruby file icons showing weird fonts?

This is a known conflict with the language-ethereum package. Remove it or switch to alternatives like language-solidity, as advised in the troubleshooting section to resolve font issues.

How to integrate File Icons with my own Atom package?

Use the service API: add consumedServices in package.json and implement a function to call addIconToElement, following the integration steps in the README for displaying icons in custom UI components.

Open-Awesome

file-icons

MITJavaScriptv2.1.47

Adds file-specific icons to Atom's file tree, tabs, and fuzzy finder for improved visual grepping.

GitHub

1.4k stars252 forks0 contributors

What is file-icons?

File Icons is an Atom package that enhances the editor's user interface by replacing generic file icons with distinct, type-specific icons. It helps developers quickly identify files by their extensions or names in the tree view, tabs, and fuzzy finder, improving visual grepping and navigation efficiency.

Target Audience

Atom users who work with large codebases or multiple file types and want to improve their visual navigation and file recognition within the editor.

Value Proposition

It offers a lightweight, highly customizable solution that integrates seamlessly with Atom's core packages and provides a clear visual hierarchy, making file management more intuitive compared to the default icon set.

Overview

Atom file-specific icons for improved visual grepping.

Use Cases

Best For

Quickly identifying file types in a large project tree
Enhancing visual navigation in Atom's fuzzy finder and tabs
Customizing the editor's appearance with specific icon sets
Improving code editor productivity through visual cues
Integrating file icons into third-party Atom packages
Reducing cognitive load when switching between file types

Not Ideal For

Developers using editors other than Atom, such as VS Code or Sublime Text
Teams wanting plug-and-play icons without any CSS customization or tweaking
Environments where editor packages are centrally managed without user access to stylesheets
Projects prioritizing minimalistic UIs with no additional visual elements

Pros & Cons

Pros

Broad Editor Integration

Works seamlessly with Atom's core packages like tree-view, tabs, and fuzzy-finder, enhancing icons across multiple UI panes for consistent visual grepping.

Rich Icon Library

Utilizes multiple icon sets including File-Icons, FontAwesome, MFizz, and Devicons, providing extensive coverage for diverse file types and reducing icon ambiguity.

High Customizability

Allows deep customization via CSS/LESS stylesheets, enabling users to resize icons, change colors, and assign icons based on file extensions or directories, as shown in the README examples.

Extensible API

Offers a service API for third-party packages to integrate file icons, making it adaptable for custom Atom package development and community extensions.

Cons

Atom-Editor Lock-in

Exclusively designed for Atom, so it's useless for developers using other editors, limiting its applicability in multi-editor or cross-platform workflows.

Manual Cache Management

Icons can stop updating due to caching issues, requiring users to manually clear cache via command palette or restart Atom, as noted in the troubleshooting section.

Breaking Changes in Updates

Major updates like v2.0 introduced breaking changes that necessitated stylesheet rewrites, potentially disrupting existing customizations and causing maintenance overhead.

Dependency on Specific Packages

Integration is limited to core Atom packages; non-core packages require extra work via the API, and issues like Ruby icon conflicts with language-ethereum show ecosystem fragility.

Frequently Asked Questions

Related Projects

atom-beautify

:mega: Help Wanted - Looking for Maintainer: https://github.com/Glavin001/atom-beautify/issues/2572 | :lipstick: Universal beautification package for Atom editor (:warning: Currently migrating to https://github.com/Unibeautify/ and have very limited bandwidth for Atom-Beautify Issues. Thank you for your patience and understanding :heart: )

Stars1,503

Forks440

Last commit3 months ago

minimap

A preview of the full source code.

Stars644

Forks125

Last commit1 year ago

atom-pigments

An Atom package to display colors in project and files.

Stars518

Forks69

Last commit3 years ago

atom-project-manager

Project manager for the Atom editor

Stars509

Forks67

Last commit4 years ago

Community-curated · Updated weekly · 100% open source

Found a gem we're missing?

Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.

Submit a project Star on GitHub