diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md index 22158bc6..b43ad10c 100644 --- a/CODE_OF_CONDUCT.md +++ b/CODE_OF_CONDUCT.md @@ -1,30 +1,42 @@ -## Code of Conduct +# Code of Conduct -We are committed to creating a welcoming and harassment-free environment for everyone who contributes to our icon repository. This includes people of all genders, gender identities, sexual orientations, disabilities, appearances, body sizes, races, ages, religions, and nationalities. +## Our Commitment -### Communication +We are committed to maintaining a welcoming and inclusive environment for everyone who contributes to our icon collection. This includes people of all backgrounds, identities, and experiences. -All communication should be appropriate for a professional audience, respectful, constructive, and considerate of people from different backgrounds. Please aim to create a positive and inclusive atmosphere. +## Expected Behavior -### Prohibited Behavior +- Be respectful and constructive in all communications +- Focus on what's best for the community +- Show empathy towards other community members +- Be open to different viewpoints and experiences -We do not tolerate harassment, intimidation, discrimination, or any other inappropriate conduct, whether in communication or behavior. Prohibited actions include: +## Unacceptable Behavior -- The use of sexual language or imagery -- Deliberate intimidation or stalking -- Unwelcome sexual attention or harassment -- Inappropriate physical contact -- Disruptions during events or conversations -- Discrimination of any kind +The following behaviors are unacceptable: -### Reporting +- Harassment, discrimination, or intimidation +- Offensive comments related to personal characteristics +- Unwelcome sexual attention or advances +- Disruptive behavior in community spaces +- Any other conduct that could reasonably be considered inappropriate -If you witness or experience behavior that violates this code of conduct, please report it immediately to [homarr-labs@proton.me](mailto:homarr-labs@proton.me). All reports will be reviewed confidentially and promptly, and appropriate actions will be taken. +## Reporting -### Consequences +If you experience or witness behavior that violates this code: -Anyone violating this code of conduct may face consequences, such as warnings, removal from the repository, or a ban from future participation. We take violations seriously to ensure a safe and welcoming environment for everyone. +1. Contact us at [homarr-labs@proton.me](mailto:homarr-labs@proton.me) +2. Provide as much detail as possible about the incident +3. All reports will be reviewed confidentially -### Acknowledgment +## Enforcement -By contributing to this repository, you agree to adhere to this code of conduct. Thank you for helping us create an inclusive and supportive environment for all contributors. +Violations of this code may result in: + +- Warning +- Temporary suspension +- Permanent ban from the community + +## Attribution + +This Code of Conduct is adapted from the [Contributor Covenant](https://www.contributor-covenant.org/), version 2.0. diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 4a077095..9c2ec4fc 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,104 +1,104 @@ -![Contributions Welcome](https://img.shields.io/badge/contributions-welcome-brightgreen?style=flat-square) +# Contributing to Dashboard Icons -## Contribution Guidelines - -Thank you for your interest in contributing to the icon repository! To ensure smooth collaboration, please follow these guidelines. Your contributions help make this project better. +Thank you for your interest in contributing to our icon collection! These guidelines will help ensure smooth collaboration and maintain the quality of our collection. ## Table of Contents -- [Contribution Guidelines](#contribution-guidelines) -- [Table of Contents](#table-of-contents) -- [Icon Specifications](#icon-specifications) - - [Format](#format) - - [Cropping](#cropping) - - [Light and Dark Versions](#light-and-dark-versions) - - [File Naming](#file-naming) - - [Quality Requirements](#quality-requirements) -- [Git Commit Messages](#git-commit-messages) -- [Contribution Process](#contribution-process) -- [Code of Conduct](#code-of-conduct) -- [Contact](#contact) +- [Contributing to Dashboard Icons](#contributing-to-dashboard-icons) + - [Table of Contents](#table-of-contents) + - [Icon Specifications](#icon-specifications) + - [Format Requirements](#format-requirements) + - [Quality Standards](#quality-standards) + - [Light \& Dark Variants](#light--dark-variants) + - [File Naming](#file-naming) + - [Requesting New Icons](#requesting-new-icons) + - [Improving the Repository](#improving-the-repository) + - [Code of Conduct](#code-of-conduct) + - [Questions?](#questions) ## Icon Specifications -### Format +### Format Requirements -- **SVG Format Required**: All icons should be submitted in SVG format. If an SVG version is unavailable, a PNG version will suffice, and a WEBP version will be generated accordingly. -- **Automatic PNG and WEBP Generation**: PNG and WEBP versions are generated automatically from the SVG (or PNG) files using the following settings: - - **Dimensions**: - - Height: 512 pixels - - Width: Auto (maintaining aspect ratio) - - **Transparency**: Enabled +- **SVG Format**: All icons must be submitted in SVG format +- **Auto-Generated Formats**: PNG and WEBP versions are generated automatically with: + - Height: 512 pixels + - Width: Auto (maintaining aspect ratio) + - Transparency: Enabled -### Cropping +### Quality Standards -- **Remove Empty Space**: Crop any empty space from your SVG files to ensure the icon is properly centered and sized. You can use [SVG Crop](https://svgcrop.com/) to assist with this. +- **Clean SVG**: No embedded raster images in SVG files +- **Proper Cropping**: Remove empty space for proper centering + - Use [SVG Crop](https://svgcrop.com/) for assistance +- **No Upscaling**: Maintain original quality without artificial enlargement -### Light and Dark Versions +### Light & Dark Variants -- **Monochrome or Single Primary Color Icons**: - - If your icon is monochrome, please provide additional versions if applicable: - - **`-light` Version**: For icons primarily dark or using black as a main color, provide a `-light` version for light backgrounds. - - **`-dark` Version**: For icons primarily light or using white as a main color, provide a `-dark` version for dark backgrounds. - - **Examples**: - - A black logo should include a `-light` version where black is inverted. - - A multicolored logo using black should provide a `-light` version with the black replaced. - - **Tool Recommendation**: [DEEditor](https://deeditor.com/) can help adjust icon colors if needed. +For monochrome or single-color icons: + +- **Light Variant**: Required for dark backgrounds + - Invert black elements + - Adjust colors for visibility +- **Dark Variant**: Required for light backgrounds + - Invert white elements + - Adjust colors for visibility + +**Tool Recommendation**: [DEEditor](https://deeditor.com/) for color adjustments ### File Naming -- **Kebab Case**: Name your files using kebab case (lowercase words separated by hyphens). For example, "Nextcloud Calendar" becomes `nextcloud-calendar.svg`. - - **Note**: Filenames are automatically converted to kebab case, but please double-check your naming to avoid conflicts or errors. +- **Kebab Case**: Use lowercase with hyphens + - Example: "Nextcloud Calendar" → `nextcloud-calendar.svg` +- **Variant Suffixes**: + - `-light` for dark backgrounds + - `-dark` for light backgrounds -### Quality Requirements +## Requesting New Icons -- **No Upscaled Images**: Icons should maintain their original quality without artificial enlargement. -- **No Embedded Raster Images in SVGs**: Ensure that SVG files are true vector graphics without embedded raster images. +To request a new icon: -## Git Commit Messages +1. **Create an Issue**: + - Use the appropriate [issue template](https://github.com/homarr-labs/dashboard-icons/issues/new/choose) + - Choose between "Light & dark icon" or "Normal icon" template -- **Use Semantic Commits**: Follow the format (scope): description: - - `feat(icons): add nextcloud-calendar` when adding new icons. +2. **Provide Information**: + - Service/application name + - Official logo or icon source + - Any specific requirements or notes -## Contribution Process +3. **Upload Icon** (optional): + - Attach the SVG file directly to the issue + - Include both light and dark variants if applicable -### Adding an icon +4. **Wait for Review**: + - Our team will review your request + - We may request adjustments if needed + - Once approved, we'll add the icon to the collection -To add an icon to the repository, follow these steps: +## Improving the Repository -1. **Create issue**: Create an issue from one of the add [templates](https://github.com/homarr-labs/dashboard-icons/issues/new/choose): - - **Light & dark icon**: Use this template to request a new icon with both light and dark versions. - - **Normal icon**: Use this template to request a new icon with a single version. -2. **Fill out the template**: Provide the requested information in the template. You can upload the icons directly to the issue. -3. **Wait for approval**: Wait for the issue to be approved by a maintainer. If any changes are needed, they will be requested in the issue. -4. **Maintainer approves & merges**: Once the issue is approved, a pull request with all the necessary changes will be created and merged by a maintainer. +To contribute to the repository itself: -### Updating an icon +1. **Fork the Repository** +2. **Make Your Changes**: + - Documentation improvements + - Website enhancements + - Repository maintenance + - Bug fixes -To update an icon in the repository, follow these steps: - -1. **Create issue**: Create an issue from the update [template](https://github.com/homarr-labs/dashboard-icons/issues/new/choose). - - **Light & dark icon**: Use this template to request a new icon with both light and dark versions. - - **Normal icon**: Use this template to request a new icon with a single version. -2. **Fill out the template**: Provide the requested information in the template. You can upload the icons directly to the issue. -3. **Wait for approval**: Wait for the issue to be approved by a maintainer. If any changes are needed, they will be requested in the issue. -4. **Maintainer approves & merges**: Once the issue is approved, a pull request with all the necessary changes will be created and merged by a maintainer. - -### Change metadata / any other change - -To change the metadata of an existing icon or any other change, follow these steps: - -1. **Fork the Repository**: Create a fork of this repository on your GitHub account. -2. **Clone the Repository**: Clone your forked repository to your local machine. -3. **Add Your Icons**: Place your SVG icon(s) into the appropriate directory, following the specifications above. -4. **Commit Your Changes**: Commit your additions with clear and descriptive commit messages using Gitmoji. -5. **Push to Your Fork**: Push your committed changes to your forked repository on GitHub. -6. **Create a Pull Request**: Submit a pull request to the main repository for review. +3. **Submit a Pull Request**: + - Use semantic commit messages following the format: `(scope): description` + - `feat(icons): add nextcloud-calendar` + - `fix(website): correct icon preview` + - `docs(readme): update installation instructions` + - Reference any related issues + - Follow our [Code of Conduct](CODE_OF_CONDUCT.md) ## Code of Conduct By contributing, you agree to abide by our [Code of Conduct](CODE_OF_CONDUCT.md). Please review it to understand the expectations for all participants. -## Contact +## Questions? -If you have any questions or need assistance, feel free to reach out at [homarr-labs@proton.me](mailto:homarr-labs@proton.me). I'm happy to help. +If you have any questions or need assistance, contact us at [homarr-labs@proton.me](mailto:homarr-labs@proton.me). diff --git a/README.md b/README.md index 88556dbc..146c0dbe 100644 --- a/README.md +++ b/README.md @@ -1,116 +1,126 @@ -> [!WARNING] -> The repository has been migrated from `walkxcode` to `homarr-labs` as I no longer have the capacity to maintain it. The Homarr team will now handle management and maintenance, ensuring that functionality remains unchanged. The project will always be usable outside of Homarr and no breaking changes will be introduced. -> ― *Bjorn* -> -> The license and guidelines have been updated, so please review them. To help with maintenance, contact us at [homarr-labs@proton.me](mailto:homarr-labs@proton.me). +# Dashboard Icons -[![jsDelivr hits (GitHub)](https://img.shields.io/jsdelivr/gh/hy/homarr-labs/dashboard-icons?style=flat-square&color=%23A020F0)](https://www.jsdelivr.com/package/gh/homarr-labs/dashboard-icons) -[![jsDelivr hits (GitHub)](https://img.shields.io/jsdelivr/gh/hy/walkxcode/dashboard-icons?style=flat-square&color=%23A020F0)](https://www.jsdelivr.com/package/gh/walkxcode/dashboard-icons) +[![jsDelivr hits](https://img.shields.io/jsdelivr/gh/hy/walkxcode/dashboard-icons?style=flat-square&color=%23A020F0)](https://www.jsdelivr.com/package/gh/walkxcode/dashboard-icons) +[![jsDelivr hits](https://img.shields.io/jsdelivr/gh/hy/homarr-labs/dashboard-icons?style=flat-square&color=%23A020F0)](https://www.jsdelivr.com/package/gh/homarr-labs/dashboard-icons) +[![GitHub Stars](https://img.shields.io/github/stars/homarr-labs/dashboard-icons?style=flat-square&color=yellow)](https://github.com/homarr-labs/dashboard-icons/stargazers) +[![Contributors](https://img.shields.io/github/contributors/homarr-labs/dashboard-icons?style=flat-square&color=blue)](https://github.com/homarr-labs/dashboard-icons/graphs/contributors) -[https://icons.homarr.dev](https://icons.homarr.dev) +> **Your definitive source for dashboard icons.** -## Dashboard Icons +A collection of over 1800 curated icons for services, applications and tools, designed specifically for dashboards and app directories. -Your definitive source for dashboard icons. -[**View icons →**](https://icons.homarr.dev) +**[→ Browse the collection at dashboardicons.com](https://dashboardicons.com)** -## Table of Contents +## Why Dashboard Icons? -- [Dashboard Icons](#dashboard-icons) -- [Table of Contents](#table-of-contents) -- [Icon Requests](#icon-requests) -- [Supported Dashboards](#supported-dashboards) -- [Usage and Details](#usage-and-details) - - [Direct Links](#direct-links) - - [Base URL](#base-url) - - [Icon Name](#icon-name) - - [Formats](#formats) - - [Dark/Light Variants](#darklight-variants) - - [Downloading Icons](#downloading-icons) -- [Disclaimer](#disclaimer) +- **Comprehensive Collection**: 1800+ icons for all popular services and tools +- **Consistent Style**: Uniform visual language across different services +- **Multiple Formats**: Available in SVG, PNG, and WEBP to suit your needs +- **Light & Dark Variants**: Icons optimized for both light and dark themes +- **Community-Driven**: Easy process to request missing icons -## Icon Requests +

+ + + +

-If you’d like to add a new icon, please review our [Contribution Guidelines](CONTRIBUTING.md) and then submit a request using [our issue templates](https://github.com/homarr-labs/dashboard-icons/issues/new/choose). +## Using the Icons -## Supported Dashboards +### Website -Dashboard Icons integrate seamlessly with several popular dashboards, including: +Find and download icons at [dashboardicons.com](https://dashboardicons.com): + +1. Search for the icon you need +2. Click on an icon to view details +3. Choose your preferred format +4. Download or copy the direct link + +### Direct Links + +Use icons from CDN with this pattern: + +``` +//. +``` + +**Base URL options:** +- jsDelivr (recommended): `https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons` +- GitHub Direct: `https://raw.githubusercontent.com/homarr-labs/dashboard-icons/main` + +**Example:** +```html +Plex +``` + +### Technical Details + +- **Naming Convention**: Kebab-case (lowercase with hyphens) + - Example: "Nextcloud Calendar" → `nextcloud-calendar` + +- **Available Formats**: + - SVG: Vector format (original source) + - PNG: 512px height (auto-generated) + - WEBP: 512px height (auto-generated) + +- **Variants**: + - `-light` suffix for dark backgrounds (e.g., `github-light.svg`) + - `-dark` suffix for light backgrounds (e.g., `github-dark.svg`) + +- **Command Line**: + ```bash + # Download with curl + curl -O https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/nextcloud.svg + + # Download with wget + wget https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/nextcloud.svg + ``` + +## Dashboard Integration + +These icons integrate seamlessly with popular dashboard applications: - [Homarr](https://github.com/ajnart/homarr) - [Homepage](https://github.com/gethomepage/homepage) - [Dashy](https://github.com/Lissy93/dashy) -## Usage and Details +...and many others! -### Direct Links +## Contributing -You can use icons directly from GitHub or through the lightning-fast jsDelivr CDN. The structure of a direct link is as follows: +### Request Icons -``` -https:////. -``` +Need an icon that's not in our collection? -For example, the WEBP version of the Nextcloud Calendar icon is available at: +1. Check the [Contribution Guidelines](CONTRIBUTING.md) for specifications +2. Submit a request using our [issue templates](https://github.com/homarr-labs/dashboard-icons/issues/new/choose) +3. Provide service details and optionally upload the icon +4. Our team will review, optimize, and add it to the collection -``` -https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/webp/nextcloud-calendar.webp -``` +### Improve the Repository -#### Base URL +Want to help with the repository itself? -We recommend using jsDelivr: +- Review our [Contribution Guidelines](CONTRIBUTING.md) +- Fork the repository, make your changes, and submit a pull request +- We welcome help with documentation, website improvements, and maintenance -- `https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons` +## Support -Alternatively, you can reference the repository directly: +- **GitHub Issues**: Report bugs or request icons +- **Email**: [homarr-labs@proton.me](mailto:homarr-labs@proton.me) -- `https://raw.githubusercontent.com/homarr-labs/dashboard-icons/refs/heads/main` +## Legal -#### Icon Name +**Disclaimer**: All product names, trademarks, and registered trademarks are the property of their respective owners. Icons are used for identification purposes only and do not imply endorsement. -Icons follow kebab-case formatting (all lowercase words separated by hyphens). For example, "Nextcloud Calendar" becomes `nextcloud-calendar`. +**License**: This project is available under the terms of the [LICENSE](LICENSE) file. -#### Formats +--- -Icons are available in these formats: - -- SVG -- PNG -- WEBP - -*All icons are generated from the base SVG file. For more details, see the [Contribution Guidelines](CONTRIBUTING.md).* - -### Dark/Light Variants - -Some icons may have very light or dark colors, which might reduce visibility on certain backgrounds. In such cases, a `-light` or `-dark` suffix is appended—for instance, "2fauth" becomes `2fauth-light`. - -*More specifics are available in the [Contribution Guidelines](CONTRIBUTING.md).* - -### Downloading Icons - -1. **Browse & Download:** - Visit [https://icons.homarr.dev](https://icons.homarr.dev) to easily view and download icons. - -2. **Using the Browser:** - On the icons page ([ICONS.md](ICONS.md)), right-click any icon link and select "Save link as". - **Note:** Loading the icons page displays every icon in the repository, which may lead to high data usage, slow performance, or even browser crashes on less powerful devices. For faster access, use the direct links or download icons individually. - -3. **Using the Terminal:** - Download icons via `curl` or `wget` by using the following structure: - - ```bash - curl -O https:////. - ``` - - or - - ```bash - wget https:////. - ``` - -## Disclaimer - -Unless stated otherwise, all images and assets in this repository—including product names, trademarks, and registered trademarks—belong to their respective owners and are used solely for identification purposes. Their inclusion does not imply endorsement. - -For more details, please review the [LICENSE](LICENSE). If you have any questions or concerns, contact us at [homarr-labs@proton.me](mailto:homarr-labs@proton.me). +

+ Made with ♥ by the Homarr Labs team and contributors +

diff --git a/assets/preview.mp4 b/assets/preview.mp4 new file mode 100644 index 00000000..b020048d Binary files /dev/null and b/assets/preview.mp4 differ