https://github.com/icelam/tints-and-shades

A tints and shades generator built using Electron and LitElement.
https://github.com/icelam/tints-and-shades

electron lit-element lit-html tints-and-shades typescript

Last synced: 5 months ago
JSON representation

A tints and shades generator built using Electron and LitElement.

• Host: GitHub
• URL: https://github.com/icelam/tints-and-shades
• Owner: icelam
• License: mit
• Created: 2020-09-01T19:58:23.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2024-01-29T08:53:08.000Z (over 1 year ago)
• Last Synced: 2025-05-14T22:12:24.519Z (5 months ago)
• Topics: electron, lit-element, lit-html, tints-and-shades, typescript
• Language: TypeScript
• Homepage:
• Size: 27.5 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

          
Tints and Shades


![Tints and Shades](./docs/key-visual-light.png)



    A tints and shades generator built using Electron and LitElement.





    

    

    

    

    

    

    



## Cool Features

The main feature of this app is to generate tints and shades of a specific color. And it comes with other cool features like:

![Pin Window - Keep the app window on top to be more efficient](./docs/explain-pin.png)

![Input format - Input colors via color picker, HEX value and RGB value](./docs/explain-input-format.png)

![Copy format - Copy generated colors as HEX code or RGB value](./docs/explain-copy-format.png)

![Random - Keep the app window on top to be more efficient](./docs/explain-random.png)

![Theme - Light mode, dark mode. Or let the system choose](./docs/explain-theme.png)

## Download

You can check the [latest release](https://github.com/icelam/tints-and-shades/releases/latest) of this app or download from the list below:

### Windows

* [Portable Executable](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/Tints.and.Shades.1.1.0.exe)

* [EXE setup file](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/Tints.and.Shades.Setup.1.0.2.exe) ([Blockmap](https://github.com/icelam/tints-and-shades/releases/download/v1.0.2/Tints.and.Shades.Setup.1.1.0.exe.blockmap))

* [32-bit MSI installation file](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/Tints.and.Shades.1.1.0.ia32.msi)

* [64-bit MSI installation file](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/Tints.and.Shades.1.1.0.msi)

### macOS

* [DMG file](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/Tints.and.Shades-1.0.2.dmg) ([Blockmap](https://github.com/icelam/tints-and-shades/releases/download/v1.0.2/Tints.and.Shades-1.1.0.dmg.blockmap))

* [Zip file](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/Tints.and.Shades-1.1.0-mac.zip)

### Linux

* [App image](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/Tints.and.Shades-1.1.0.AppImage)

* [App image for i386](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/Tints.and.Shades-1.1.0-i386.AppImage)

* [DEB file for amd64](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/tints-and-shades_1.1.0_amd64.deb)

* [DEB file for i386](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/tints-and-shades_1.1.0_i386.deb)

* [RPM file for i686](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/tints-and-shades-1.1.0.i686.rpm)

* [RPM file for x68 (64-bit)](https://github.com/icelam/tints-and-shades/releases/download/v1.1.0/tints-and-shades-1.1.0.x86_64.rpm)

## For Developers - Setup ##

Below shows some basic setup steps.

### Node version ###

This project is developed using Node.js 12. The version is already specified in the `.nvmrc` file. Suggest to run `nvm use` when you enter the project folder.

### Install packages need for the project ###

Install yarn packages in project root folder first using `yarn install`.

### To start the project ##

Run `yarn start` in project root folder.

### To build the app for distribution ###

Run `yarn package`  in the project root folder to create package for macOS, Linux and Windows. All the output files can be found in `./build-packages` folder.

To create package for each individual platforms:

* macOS: `yarn package:mac`

* Linux: `yarn package:linux`

* Windows: `yarn package:windows`

### To run unit tests ###

Run `yarn test` in the project root folder.

### To run linters ###

Run `yarn lint` in the project root folder to start a ESLint checking.  

Run `yarn lint:lit-analyzer` in the project root folder to run Lit Analyzer.

### To run web component analyzer ###

Run `analyze:web` in the project root folder.

### To update change log ###

Run `yarn release` in the project root folder.  

To skip bumping version number on first release, run `yarn first-release` in the project root folder

## To update alias ##

To add or modify any existing alias, please modify all the files listed below:

1. `.eslintrc`

2. `tsconfig.json`

3. `webpack/webpack.base.conf.js`