Coder Social home page Coder Social logo

toinane / colorpicker Goto Github PK

View Code? Open in Web Editor NEW
1.5K 23.0 117.0 29.73 MB

A mininal but complete colorpicker desktop app

Home Page: https://colorpicker.fr

License: GNU General Public License v3.0

CSS 10.31% HTML 4.61% JavaScript 85.07%
color-picker comparison rgb hex electron color picker colorpicker

colorpicker's Introduction

ColorPicker icon

Colorpicker

A mininal but complete colorpicker desktop app

colorpicker-app

Want to help to translate this app? go on Crowdin! Your help is welcome :)

Colorpicker is a desktop tool with Electron to get and save colors code quickly for OSX, Windows and Linux!

ColorPicker App

Colorpicker's menu come with a lot of cool features :

  • Pin: pin Colorpicker to the foreground;
  • Picker: open an eyedropper who can pick a color from your desktop;
  • Colorsbook: open Colorsbook, a color manager;
  • Shading: show three bar of shading β€” hue bar, natural bar and lightness bar;
  • Clean Vue: unshow menu, ranges and inputs;
  • Magic color: show colors from the clipboard;
  • Random: show a random color;
  • Settings: open the preferences panel.

Pin

Pin screenshot

With Pin, you can bring Colorpicker to the foreground. This makes it convenient to work quickly with different applications at the same time.


Picker

Picker screenshot

The Picker allows you to quickly retrieve a color anywhere on the screen. Whether it's on your browser, Photoshop, or whatever.


Colorsbook

Colorsbook screenshot

Colorsbook is a full-fledged application. It allows you to store your colors, categorize them, and easily retrieve them. It is destined to mature over time. Cool tip: you can save color from colorpicker with CMD+S or CTRL+S!


Shading

Tint screenshot

With the shades, you can find the perfect color you need. You have a chromatic bar, a natural color bar and a shadow bar.


Focus Mode

Focus screenshot

Need to compare a color or clean up the interface? This feature is for you, this will hide the sliders and make the menu more transparent.


Magic Color [WIP]

This functionality is still under development. Currently, it allows you to display the first color that is in your clipboard. This works with hexadecimal and RGB codes


Random

A traditional feature, it allows you to display a color randomly.


Settings

Settings screenshot

The settings menu allows you to customize your Colorpicker, I let you discover it yourself :)!

Download

Want to support me?

You can buy me a coffee here! Thank you!

Happy Design !

Developers

Changelog

See changelog here.

How to compile

  • Install dependencies:
yarn
  • To build C/C++ modules to the correct Electron version, use:
yarn rebuild
  • To build a new version:
# You can build nightly & release only for your current OS.
# i.e. you can't build a OSX version if you use a Windows

# build a nightly version
yarn nightly

# build a release version
yarn release

colorpicker's People

Contributors

amitmerchant1990 avatar dependabot[bot] avatar imgbot[bot] avatar toinane avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

colorpicker's Issues

Display Scale other than 100%: The color picker circle widget's position doesn't match the cursor [Windows 10]

Describe the bug
The color picker widget doesn't adapt to other Windows UI scaling than 100% β†’ it does sample the color under the mouse, but the widget ring gets more and more offset when moving away from the 0, 0 upper left corner coordinate of the screen.

To Reproduce
Steps to reproduce the behavior:

  1. Windows 10 / Settings / Display
  2. Set Scale to a higher number than 100%
  3. Activate the color picker
  4. See error

Expected behavior
The color picker circle widget position should match the cursor.

Screenshots
DisplayScaleIssue
.

OS (please complete the following information):

  • Windows 10 Home
  • 1909

Colorpicker (please complete the following information):

  • 2.0.3

build error

My environment:
macOS: 10.13.6
nodejs: 10.10.0

and the error is:

johnny@localhost:~/colorpicker-master$ yarn release
yarn run v1.9.4
$ build --publish=never --config colorpicker-build.json
β€’ electron-builder version=20.0.8
β€’ loaded configuration file=/Users/liq/Downloads/colorpicker-master/colorpicker-build.json
β€’ writing effective config file=out/electron-builder.yaml
β€’ rebuilding native production dependencies platform=darwin arch=x64
β€’ rebuilding native dependency name=osx-mouse
β€’ rebuilding native dependency name=robotjs
β€’ packaging platform=darwin arch=x64 electron=1.8.4 appOutDir=out/mac
Downloading tmp-13193-1-SHASUMS256.txt-1.8.4
[============================================>] 100.0% of 3.43 kB (3.43 kB/s)
β€’ skipped macOS application code signing reason=cannot find valid "Developer ID Application" identity or custom non-Apple code signing certificate, see https://electron.build/code-signing allIdentities=
1) 8575B27EE6CC2A75A4C19B2904335AC3094F4FCA "com.apple.idms.appleid.prd.7547466d49716370776f4e2b6f456a417454645776413d3d" (CSSMERR_TP_CERT_EXPIRED)
2) 1F22E5B1071FA0CDBFCF02E0C095C74FC792386B "iPhone Developer: qiang li (YU5Z5XFL59)" (CSSMERR_TP_CERT_EXPIRED)
3) BBBD8D8B01985395E381EB13424040B67EB58F0E "iPhone Distribution: Beijing Medvision Information Technology Co., Ltd. (87GLMWCJKE)" (CSSMERR_TP_CERT_EXPIRED)
4) ECF4629D347D69D65622081F40F9BEB472B91ECC "iPhone Developer: [email protected] (8FV3CZCCVY)" (CSSMERR_TP_CERT_EXPIRED)
5) B43EECB44228516DB607B1ACD93B6B826CBEA9D2 "com.apple.idms.appleid.prd.7547466d49716370776f4e2b6f456a417454645776413d3d" (CSSMERR_TP_CERT_EXPIRED)
6) 339F31E90DB580552B48953EEB43588F01727EDB "com.apple.systemdefault" (CSSMERR_TP_NOT_TRUSTED)
7) C84DB4E1F3CAF8F8CDADEED61CB37A3049AD0516 "com.apple.kerberos.kdc" (CSSMERR_TP_NOT_TRUSTED)
7 identities found

                                           Valid identities only
                                              0 valid identities found

β€’ building target=macOS zip arch=x64 file=out/Colorpicker-2.0.1-mac.zip
β€’ building target=DMG arch=x64 file=out/Colorpicker-2.0.1.dmg
Error: Cannot find module 'builder-util/out/license'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
at Function.Module._load (internal/modules/cjs/loader.js:507:25)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:20:18)
at _load_license (/Users/liq/Downloads/colorpicker-master/node_modules/dmg-builder/out/dmgLicense.js:87:23)
at /Users/liq/Downloads/colorpicker-master/node_modules/dmg-builder/src/dmgLicense.ts:13:30
at Generator.next ()
From previous event:
at addLicenseToDmg (/Users/liq/Downloads/colorpicker-master/node_modules/dmg-builder/out/dmgLicense.js:74:21)
at /Users/liq/Downloads/colorpicker-master/node_modules/dmg-builder/src/dmg.ts:58:31
at Generator.next ()
From previous event:
at DmgTarget.build (/Users/liq/Downloads/colorpicker-master/node_modules/dmg-builder/out/dmg.js:243:11)
at taskManager.addTask.default.map.it (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/src/platformPackager.ts:121:67)
From previous event:
at MacPackager.packageInDistributableFormat (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/src/platformPackager.ts:121:23)
at /Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/src/macPackager.ts:95:26
at runCallback (timers.js:694:18)
at tryOnImmediate (timers.js:665:5)
at processImmediate (timers.js:647:5)
From previous event:
at /Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/src/macPackager.ts:95:10
at Generator.next ()
From previous event:
at MacPackager.pack (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/out/macPackager.js:209:11)
at /Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/src/packager.ts:372:24
at Generator.next ()
at xfs.stat (/Users/liq/Downloads/colorpicker-master/node_modules/fs-extra-p/node_modules/fs-extra/lib/mkdirs/mkdirs.js:56:16)
at /Users/liq/Downloads/colorpicker-master/node_modules/graceful-fs/polyfills.js:287:18
at FSReqWrap.oncomplete (fs.js:155:5)
From previous event:
at Packager.doBuild (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/out/packager.js:441:11)
at /Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/src/packager.ts:316:52
at Generator.next ()
at /Users/liq/Downloads/colorpicker-master/node_modules/graceful-fs/graceful-fs.js:99:16
at /Users/liq/Downloads/colorpicker-master/node_modules/graceful-fs/graceful-fs.js:43:10
at FSReqWrap.oncomplete (fs.js:141:20)
From previous event:
at Packager._build (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/out/packager.js:385:11)
at /Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/src/packager.ts:278:23
at Generator.next ()
at runCallback (timers.js:694:18)
at tryOnImmediate (timers.js:665:5)
at processImmediate (timers.js:647:5)
From previous event:
at Packager.build (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/out/packager.js:341:11)
at /Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/src/index.ts:50:40
at Generator.next ()
From previous event:
at build (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder-lib/out/index.js:47:21)
at build (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder/src/builder.ts:228:10)
at then (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder/src/cli/cli.ts:48:33)
at runCallback (timers.js:694:18)
at tryOnImmediate (timers.js:665:5)
at processImmediate (timers.js:647:5)
From previous event:
at Object.args [as handler] (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder/src/cli/cli.ts:48:33)
at Object.runCommand (/Users/liq/Downloads/colorpicker-master/node_modules/yargs/lib/command.js:235:44)
at Object.parseArgs [as _parseArgs] (/Users/liq/Downloads/colorpicker-master/node_modules/yargs/yargs.js:1074:24)
at Object.get [as argv] (/Users/liq/Downloads/colorpicker-master/node_modules/yargs/yargs.js:989:21)
at Object. (/Users/liq/Downloads/colorpicker-master/node_modules/electron-builder/src/cli/cli.ts:42:15)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Function.Module.runMain (internal/modules/cjs/loader.js:742:12)
at startup (internal/bootstrap/node.js:279:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:696:3)

Windows fresh build fails

As the title says, for about the last 3 hours (yup, this time) i was trying to do a simple npm install and i cannot get it to work due to:

  • MSBuild Cpp errors (file is missing, may be a bug from executable)
  • Python is required (v2.7 but not up to v3) to build robotjs
  • and other weird issues related to the items above

I can't put the error messages here because i already solved some of them and i lost the error messages...

So, i thing all the issues i've got was related only to robotjs build.
Is there a way to skip this build process or even make it easier?

UPDATE 1

i've just found some errors reported by the npm install

  • MSBUILD : error MSB4132: The tools version "2.0" is unrecognized. Available tools versions are "4.0"
    • then i tried to npm install --global --production windows-build-tools described here (chjj/pty.js#60)
  • C:\wamp64\www\colorpicker\node_modules\robotjs\build\robotjs.vcxproj(20,3): error MSB4019: The imported project "C:\Mic
    rosoft.Cpp.Default.props" was not found. Confirm that the path in the declaration is correct, and that the fil
    e exists on disk.
  • gyp ERR! stack import sys; print "%s.%s.%s" % sys.version_info[:3]; gyp ERR! stack ^ gyp ERR! stack SyntaxError: invalid syntax
    • this throws when i try to use python 3+ version

Signed app on MacOS

I can't run colorpicker on MacOS High Sierra v10.13.3 (17D102)
It is signed ?

Signed App

Tray icon not so visible

The problem

The tray icon not so visible to see on a dark background such as Windows (I assume that also on MacOS with Dark Mode set to ON)

Suggestion for the solution

so maybe in case of a dark mode in MacOS or in windows or some other OS that the background of where the tray icon will be seen is dark

There are 2 options that I can think of to fix it:

The Quick & Easy Way

Set the Windows icon to be white instead of black

The Customizable option (I Prefer this option)

At the ColorPicker preferences add option to:

  • Select between different sets of icons
  • Chose the color of the icon (advanced option)

icon-bug

Add Colorsbook into Colorpicker

  • Add this little web app into colorpicker : https://crea-th.at/p/hexacolor/ :

  • Can add new categories

  • Can save color from colorpicker

  • Can import/export colors

  • Can show color to colorpicker

  • Can apply color on clipboard

  • Can change background color & can apply background color from colorpicker

  • Can drag color into another categorie

  • Can change position of categorie and color

example :

{
  pastel : [
    "#212342",
    "#298373",
    "#093737"
  ],
  vif: [
    "#ae3929"
  ]
}

Windows maximize/minimize button bug

Only maximize behavior is working as expected, the same one cant minimize when fired again. so when maximized, the app stills maximized untill manually resize with drag

Add picker into colorpicker

  • Add new browserWindow
  • Can see box of colors (and not just one color)
  • Show color in colopicker when selected

Edit colors in colorsbook

image

It'd be very useful to be able to edit these colors once defined here. Also, perhaps adding rgba as an option would be handy, as opacity can be defined in the picker.

Version 3.0.0

The next major update will be a complete refactoring.
The purpose of this update is to convert all code to Typescript.
It's also the moment to add new features and fix old bugs.

I define below everything that Colorpicker must do in this version:

Development

  • Use Typescript
  • Make Tests for all features
  • Reduce all unused codes
  • Optimize code
  • Make performances tests
  • Add a documentation

Features

  • I can use RGB Sliders
  • I can use the scroll on Sliders
  • I can use the scroll on Inputs
  • I can use HSL Sliders
  • I can use CMYK Sliders
  • I can choose if I want an icon in menu or in tray or both
  • I can choose if Colorpicker can be launched at startup
  • I can use and update shortcuts
  • I can choose if I want have color in clipboard when I click on Hex Input
  • I use the picker on Windows, MacOS and Linux
  • I can use the transparent Slider
  • I can set the Opacity mode
  • I can get random color
  • I can open the preferences menu
  • I can set Colorpicker on top of all applications
  • I can open Colorsbook
  • I can insert colors in Colorpicker from my clipboard
  • ...

Details UX

  • The icon menu or tray is updated with the disposition of sliders
  • The background color of selecting text is the invert of current color
  • The icon tray is white or black in function of the OS theme color

I will complete this list if I missed an element.

util: when scroll or up/down key on input

When you scroll or use up/down key on input, it will add/remove 1 to r, g, and b.
But when I use this feature on the r for example, it will add/remove 2 just for the r, and 1 for the g and b.
bug on #2

Picker feature is laggy

Describe the bug
When I use the picker, It really laggy when I have a lot of opened applications like the browser.
It slow also when I use the picker on a second screen.

To Reproduce
Steps to reproduce the behavior:

  1. Go to colorpicker
  2. Click on picker feature
  3. Use it on the screen or a second screen with a lot of others opened applications.

Expected behavior
Picker shouldn't be slow.

OS (please complete the following information):

  • OS: Linux / Ubuntu / Arc Linux / ...?
  • Version 10.19 / ...?

Colorpicker (please complete the following information):

  • Version 2.0.3 / 2.0.4

Font awesome toggle icons not displaying in the settings window

I have noticed that the font awesome toggle icons used in the settings pane are not displaying (a box is displayed instead of the actual font awesome icon).

I have identified the issue to be the font-family css attribute value in views/css/settings.css (lines 128 and 131): 'FontAwesome' is the incorrect font-family name.

The fix is simple: remove the font-family name from the css rules in the settings.css because the .fa class specifies the correct font-family name.

colorpicker_fa_icon_issue

Colorpicker improvments

Improvments to make for #2

  • Can save color with the picker
  • Can show color in colorpicker with picker in real time
  • prev: make it optionnal /\
  • Add touch bar support :)
  • Can have history of colors with ctrl+Z & ctrl+Y and with an icon (10 colors?)

Add Shortcuts

We can add shortcuts for the application

Features

Possible Actions

  • Copying a color that the mouse is currently hovering on
  • Pin Colorpicker to the foreground
  • Open an eyedropper
  • Open Colors book
  • Toggle Shading (if it is shown or not)
  • Toggle Opacity range
  • Unshow menu, ranges, and inputs
  • Show colors from the clipboard
  • Show a random color
  • Open the preferences panel.

Setting view

I think that you can add in the setting a tab called Hot Keys
In short, the actions that gonna be there are customizable and searchable

In long:

  • Search shortcuts by action name (above I wrote a list of possible actions) and/or key combination (he can write Ctrl it will show him all the key combination with Ctrl key) and/or by pressing the shortcut (little popup to press the shortcut inside)
  • Change key combination
    • Change shortcut by writing the shortcut or by pressing the shortcut in little popup that meant for that (like in the shortcut search)
  • Delete key combination (can be done by removing the text in the hotkey input

Scenario

I downloaded the new version of the ColorPicker, when I finished downloaded it and open a pop up been shown - Release notes that says:

Release Notes for x.x

The new release contains shortcuts!

With shortcuts you can make your job faster

Example for useful shortcuts:

  • Grab Color right to your clipboard by pressing Ctrl + G
  • Open Eye Dropper by pressing Ctrl + E

You can even customize them to whatever you want

... more features in the release

I'm getting excited because Whoo hoo, Shortcuts!

How hoo

So I update to the new version
Then I try the Grab color shortcut but unfortunately this shortcut was already assigned by another program (i.e to open the mail)

So I remember that in the release notes pop up they said that I can customize the shortcut (and even if I don't remember this is a natural place for people to look at)

I open the preferences and go to the Hot Keys tab

I don't know what the shortcut called and I'm lazy to start writing the shortcut

So I tap the little icon for grabbing shortcuts and I press the shortcut (the mail window opens again, I close it) and the action is listed there

I click the little icon again for grabbing shortcuts, and press (Ctrl + Alt + G) unfortunately this shortcut already been taken by (i.e Open Colors book)

I have 2 options in there

Remove Open Colors book hotkey | Add anyway | Cancel
(this are buttons)

when I hover above the button Remove Open Colors book hotkey a tooltip/popup been shown

Inside was written

This will set the hotkey you choose to Grab color and will remove the hotkey from Open Colors book

I click Remove Open Colors book hotkey button
Now I can use Ctrl + Alt + G to Grab color

And I live happily ever after


Sorry for the long issue I caught up in the moment

colors names

Colorpicker give a name for each color and we can get a color from his name

Add option to remove OS buttons

I use a borderless window anager (i3-gaps) on Linux (Arch Linux), that means no close, minimize or maximize buttons nor window borders, and Colorpicker doesn't adhere to my system theme (GTK), it forces the icons in.
image

Feature emitted by @cristianovitorino

Lock in the first plan feature for Colorsbook

Hi,
In Colorpicker, I use the "lock in first plan" feature. It would be really cool and useful if you can do the same thing with Colorsbook. When you click on the "lock in first plan" button, It will lock Colorpicker and Colorsbook when the last one is opened.

Thanks :)

Picker feature for Linux

Picker doesn't work on Linux. We use two native dependencies for the picker.

The author of these dependencies didn't create a Linux version sadly.

So I started to fork the macos version, and try to make it compatible with Linux. As I'm not a C/C++ expert, It could be difficult.
Some help would be welcome. See linux-mouse

[FR] color wheel based on picked color

Screen Shot 2020-02-20 at 17 05 40

When picking a color the wheel update to propose you colors related to the picked color.

I use that feature all the time. Would love to see that in your app.

Check mouse event in main process

Check if possible to have mouse move event on main process.
For the getColor() -> picker.js improvement.

Check if the window can follow the mouse too!
for PR #2

Does not support multiple monitors

When using the color picker eyedropper, if you move your cursor to a monitor different than the primary monitor the color picker always shows white (#FFFFFF) and not the actual color under the cursor.

I am using version 2.0.0

App does not start at all - Error processing argument at index 1

When trying to start the app, I get an error. I also have uninstalled it and re-installed it.
I have 2 monitors, they have different DPI. I remember the app was not liking that much when it came to use the pipet.

[Window Title]
Error

[Main Instruction]
A JavaScript error occurred in the main process

[Content]
Uncaught Exception:
TypeError: Error processing argument at index 1, conversion failure from Error: Invalid data: 
    at Object.showErrorBox (C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\electron.asar\browser\api\dialog.js:283:20)
    at electronStorage.get (C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\src\storage.js:33:16)
    at C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\node_modules\async\dist\async.js:473:16
    at next (C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\node_modules\async\dist\async.js:5315:29)
    at C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\node_modules\async\dist\async.js:958:16
    at C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\node_modules\electron-json-storage\lib\storage.js:150:16
    at nextTask (C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\node_modules\async\dist\async.js:5310:14)
    at next (C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\node_modules\async\dist\async.js:5317:9)
    at C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\node_modules\async\dist\async.js:958:16
    at C:\Users\asus\AppData\Local\Programs\Colorpicker\resources\app.asar\node_modules\electron-json-storage\lib\storage.js:135:18

[OK]

graphical palette comparison

On some use case it could be interesting to see all color of a color palette at the same time on the color gradient panel. It could also be very useful to compare two palette graphically through this kind of display.

My initial use case is: I was on a migration from 2 themes, and the colors are named completely differently, with different number of gray, red, blue. With this kind of feature, I was be able to compare old and new theme in the gradient panel to find the nearest color.

Names for colors

Thank you so much for this program, I use it every day.

What about names for the colors?
When there are very much colors in big projects, it can be very tricky to find the right one.
And maybe groups could be good too, but not necessary.

macOS Dark Mode/Dock Icon

Hi! It’s a great app, thanks for it!

Do you consider having an option to hide it from the Dock and have a white Menubar Icon when macOS Dark mode is enabled? Also an option to set a systemwide Shortcut would be great!

Change colorspace?

It seems that now the app only supports working under RGB colorspace, which is not very handy when it comes to color theme design where it's more convenient working under HSV colorspace.

It will be nice to have this feature!

Auto Update mechanism

Maybe this application can add auto-update mechanism for always be at the latest version

ColorBook input error

Currently colorbook option accepts any value when trying to save a color code. If an incorrect value is entered (something other than a color code) it displays a blank space where the color circle would have gone. Some validations might be nice to have.

Great app btw!

Window options readability

I think the window options (currently as circles) should be solid black/white icons to improve the readability as we can see here

The options may be invisible at some cases (same solid color from colorpicker background)

pin

Tools issue

When a tool isn't in menu and you use the right click menu, it crash.

-> Changes all "toggle" functions to accept boolean and save it in colorpicker class.

It will be done in #2

Add somes improvments UI for settings window

Also on the mockup is a suggestion for UX on the settings UI, instead of a miriad of colorful icons for each section, maybe highlight only the pane that the user is currently on, and grey out the rest. A accented bar that matches the icon color also helps visualize this. And no need for text if we have the icons to express the metaphor. Also this way it becomes more color blind friendly, not sure if a color blind person would use a color picker too much, but usually it's good practice to consider this. The overall idea here is declutter. But please don't take this as criticism, there is nothing really wrong with your current design, it's just a suggestion really, a possibility.

And here, maybe an outline around the selected pane? To match the lines used elsewhere on the UI, rather than just a blank pane.

image
image

Improvments emitted by @cristianovitorino

can customize colorpicker

  • Add new panel who you can customize colorpicker
  • Can change buttons (quit, minimize, maximize): OSX, Window, Linux
  • save position and size of colorpicker
  • save previous color
  • can drag and drop tools icons in settings
  • change color of button (quit, ...) on OSX
  • choose between tray icon or main icon

Done in #2

Please publish AppImage for Linux on GitHub Releases

Please publish an AppImage for Linux on GitHub Releases.

It is already configured, so should be straightforward:

colorpicker/package.json

Lines 12 to 16 in 8a8f44f

"release-linux": "build --publish=never --config colorpicker-build.json --linux deb, apk, rpm, zip, appImage",
"release-window": "build --publish=never --config colorpicker-build.json --win nsis, portable",
"nightly": "build --publish=never --config colorpicker-build-nightly.json",
"nightly-linux": "build --publish=never --config colorpicker-build-nightly.json --linux deb appImage",
"rebuild": "npm rebuild --runtime=electron --target=$(npx electron -v) --disturl=https://atom.io/download/electron --abi=$(npx electron --abi)"

Unable to launch

Today I wanted to launch the colorpicker and was greeted by this error:

Uncaught Exception: TypeError: Error processing argument at index 1, conversion failure from Error: Invalid data: at Object.showErrorBox (/Applications/Colorpicker.app/Contents/Resources/electron.asar/browser/api/dialog.js:283:20) at electronStorage.get (/Applications/Colorpicker.app/Contents/Resources/app.asar/src/storage.js:33:16) at /Applications/Colorpicker.app/Contents/Resources/app.asar/node_modules/async/dist/async.js:473:16 at next (/Applications/Colorpicker.app/Contents/Resources/app.asar/node_modules/async/dist/async.js:5315:29) at /Applications/Colorpicker.app/Contents/Resources/app.asar/node_modules/async/dist/async.js:958:16 at /Applications/Colorpicker.app/Contents/Resources/app.asar/node_modules/electron-json-storage/lib/storage.js:150:16 at nextTask (/Applications/Colorpicker.app/Contents/Resources/app.asar/node_modules/async/dist/async.js:5310:14) at next (/Applications/Colorpicker.app/Contents/Resources/app.asar/node_modules/async/dist/async.js:5317:9) at /Applications/Colorpicker.app/Contents/Resources/app.asar/node_modules/async/dist/async.js:958:16 at /Applications/Colorpicker.app/Contents/Resources/app.asar/node_modules/electron-json-storage/lib/storage.js:135:18

I tried downloading a fresh version but that didn't change anything.

In hope the issue is not to bad and it's not an error on my side

Elias :)

new idea (feat. Ryunako)

Features :

  • Add menu on right click (options: 'copy #xxxxxx', copy rgb(xxx, xxx, xxx)', 'save color', etc.).
  • Add alpha canal and make colorpicker's background clear (#rrggbbaa).
  • Make more build option (win: 3 builds : silent, full, portable).
  • Add on the settings page : thank's part & update notification
  • Can insert color from copy on button click (presse papier)
  • Show windows when more of one color from copy

Improvements :

  • On hove tools icons, it will show a text about the icon.
  • Unshow selection when selected tools icons.
  • Add more difference when tool icon is active or not.
  • Remove 'rgb(xxx, xxx, xxx)' text and move hex input.
  • Customize more "about colorpicker" panel.
  • Make app_buttons more like discord ones for windows.

Bugs :

  • When white color, the cursors aren't visible.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.