A Flash Developer Resource Site

Results 1 to 7 of 7

Thread: Script to determine 100 neutral grey hex values between #000000 and #FFFFFF

  1. #1
    Junior Member
    Join Date
    Apr 2021
    Posts
    3

    Question Script to determine 100 neutral grey hex values between #000000 and #FFFFFF

    I'd like to know the hex codes for 100 neutral greys between #000000 and #FFFFFF (or 0x000000 and 0xFFFFFF), and I was wondering if there is an easy way to script this.
    Essentially it would look kind of like this: 0xbdbdbd, 0xbababa, 0xb5b5b5, etc. but evenly divided into 100 incremental shades (if that makes sense). Thanks in advance for your help.

  2. #2
    Client Software Programmer AS3.0's Avatar
    Join Date
    Apr 2011
    Posts
    1,185
    Hello Pherank, a good way to get a range of a color like greys is to understand how the color wheel or "palette" works. Colors are separated by what is called hue which is the degree number 0-360. What I like to do to distinguish a certain color is to see the lowest hue degree I can get of the color example: one color might be verified if the hue is greater than 340 and also less than 359. Checking for luminance is another way to filter out a specific color, luminance is much like a circumference of the color wheel because a low luminance is a very dark shade of the color in the hue range which is the outline of the circular color wheel, and high luminance is very bright value reaching upto the center of the color wheel palette, so the main thing to focus on is getting the degrees of hue for the color you want which is grey, so in that case you would be looking for the hue range of black which is logical and restricting the luminance to be a little greater than black but less than what may be a white center.

    I made a quick demo here which provides the source fla of tracking my skin color, I found that by just focusing on hue and not worrying about luminance that I could still be tracked by skin color in a darker room if that gives you an idea of what I've described.

    Finding these values you are looking for requires skill between amateur and professional and can be very time consuming to program a proper setup, you can either use the source I provided in the video below to help guide you or send a donation here to give me the motivation to provide you with the custom help I want to give.

    Last edited by AS3.0; 04-18-2021 at 02:42 AM.
    big study day today.

  3. #3
    Junior Member
    Join Date
    Apr 2021
    Posts
    3
    Thanks, but that's not exactly what I'm looking for here.

    I asked a web developer friend about this, and he found it pretty easy to do in JavaScript - I just need to figure out how to translate to AS 3:

    <html>
    <body onload="shadesOfGrey()">

    <div id="palette"></div>

    <script>
    function shadesOfGrey() {
    let count = 100;
    for (let i = 0; i < count; i++) {
    let float = (255 / (count - 1)) * i;
    let int = Math.floor(float);
    let hex = (int).toString(16);
    if (int < 16 ) { hex = '0'+hex; }
    let color = hex+hex+hex;
    // console.log(i, float, int, hex, color);
    let parent = document.getElementById('palette');
    parent.insertAdjacentHTML('beforeend', '<div style="background-color:#'+color+'">'+color+'</div>');
    }
    }
    </script>
    </body>
    </html>

  4. #4
    Client Software Programmer AS3.0's Avatar
    Join Date
    Apr 2011
    Posts
    1,185
    well here is the port, I can see the first color is black and the next color showed up as greyer.



    PHP Code:


    //<div id="palette"></div>

    function shadesOfGrey() {
    var 
    count 100;
    for (var 
    0counti++) {
    var 
    float = (255 / (count 1)) * i;
    var 
    intt Math.floor(float);
    var 
    hex = (intt).toString(16);
    if (
    intt 16 ) { hex '0'+hex; }
    var 
    color hex+hex+hex;
    trace(i" " float" " intt" " hex" " color);
    //let parent = document.getElementById('palette');
    //parent.insertAdjacentHTML('beforeend', '<div style="background-color:#'+color+'">'+color+'</div>');
    }
    }


    shadesOfGrey() 
    Last edited by AS3.0; 04-18-2021 at 06:12 PM.
    big study day today.

  5. #5
    Client Software Programmer AS3.0's Avatar
    Join Date
    Apr 2011
    Posts
    1,185
    Yeah that is an easy one, my palette showed some other color for #000000 when I hovered it.
    Last edited by AS3.0; 04-18-2021 at 06:40 PM.
    big study day today.

  6. #6
    Junior Member
    Join Date
    Apr 2021
    Posts
    3
    Quote Originally Posted by AS3.0 View Post
    well here is the port, I can see the first color is black and the next color showed up as greyer.

    PHP Code:


    //<div id="palette"></div>

    function shadesOfGrey() {
    var 
    count 100;
    for (var 
    0counti++) {
    var 
    float = (255 / (count 1)) * i;
    var 
    intt Math.floor(float);
    var 
    hex = (intt).toString(16);
    if (
    intt 16 ) { hex '0'+hex; }
    var 
    color hex+hex+hex;
    trace(i" " float" " intt" " hex" " color);
    //let parent = document.getElementById('palette');
    //parent.insertAdjacentHTML('beforeend', '<div style="background-color:#'+color+'">'+color+'</div>');
    }
    }


    shadesOfGrey() 

    Thanks very much for doing that. I ran into some interesting problems when I tried to type the variables, while using AS 3's beginFill operation. I ended up with this:

    var count: uint = 100;
    var opacity: Number = 1;

    for (var i = 0; i < count; i++) {

    var float: uint = (255 / (count - 1)) * i;
    var intt: uint = Math.floor(float);
    var hex = (intt).toString(16);
    if (intt < 16) {
    hex = '0' + hex;
    }
    var color = '0x' + hex + hex + hex;

    newGraphic.graphics.beginFill(color, opacity);

    // More code down here

    }

    Both the hex and color vars can't be explicitly typed without yielding an error. "hex" is an int that gets turned into a String, so I get the confusion there. "color" can't decide whether its a uint or a String. Leaving off the type works for now.

  7. #7
    Senior Member
    Join Date
    Feb 2005
    Posts
    1,823
    Here's a working example. example.fla You'll need to add a slider and name it slide. Adding the component ended up putting the file over the size limit.
    .

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center