Skip to content

Define Stops by percentage #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
qimmiq opened this issue Jun 5, 2018 · 5 comments
Open

Define Stops by percentage #6

qimmiq opened this issue Jun 5, 2018 · 5 comments
Labels
enhancement New feature or request

Comments

@qimmiq
Copy link

qimmiq commented Jun 5, 2018

Is your feature request related to a problem? Please describe.
Coming from Photoshop our Design Team is used to work with precise Stops in the gradient. Dividing a gradient in to 10 Stops, like sketch does it natively via the number keys, works "ok". But being even more precise and converting existing designs it would be awesome to have the ability to work with that percentage

Describe the solution you'd like
Define a step with percentage. From where i understand the percentage is available because it is copied into the css code already

But nevertheless this plugin is giving the gradient tool what it is lacking ... thanks for that. Keep on rockin ;)

@larsenwork
Copy link
Owner

@qimmiq cheers, I'm not too familiar with photoshop anymore — could you show an example screenshot and/or code of exactly what you're talking about. It sounds like something that should be doable.

@larsenwork larsenwork added the enhancement New feature or request label Jun 14, 2018
@DennHa
Copy link

DennHa commented Jun 15, 2018

I guess qimmiq is reffering to the "Location" input field in photoshop gradients: https://pe-images.s3.amazonaws.com/basics/cc/gradients/gradient-editor/midpoint-location-25percent.jpg

@qimmiq
Copy link
Author

qimmiq commented Jun 18, 2018

@larsenwork @DennHa is totally right. i was talkin about the location field. As u can see on the screenshot DennHa postet there is an input field to define the location of a stop by percentage.

Also in the CSS & SVG Code the Stops are defined by percentage aswell.

/* Rectangle: */
background-image: linear-gradient(-180deg, #EEEEEE 0%, #E7E7E7 26%, #E5E5E5 38%, #DEDEDE 74%, #D8D8D8 100%);

so it would be aswome to define stops location by percentage :)

@larsenwork
Copy link
Owner

You are talking about two different things — @DennHa screenshot shows midpoint location which I could somewhat easily add as it works conceptually similar to using timing functions as it defines how two colors are mixed.

The other one is a bit more tricky since the underlining concept behind using timing (easing) functions is not having to add/edit colorstops manually — instead you just "shape" the gradient with the function. I could add a separate window where one could add, edit and remove color stops but that could also be done in a different plugin.

@qimmiq
Copy link
Author

qimmiq commented Jun 29, 2018

@larsenwork i see whats the problem/ difference. sadly im new to all this plugin in stuff and also my coding skills are not anything close to usefull here. but maybe with your help i/we (@DennHa ) can built a small plugin to define custom stops 💯

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants