Skip to content

Instantly share code, notes, and snippets.

@mucar
Created October 16, 2012 11:47
Show Gist options
  • Save mucar/3898821 to your computer and use it in GitHub Desktop.
Save mucar/3898821 to your computer and use it in GitHub Desktop.
Javascript Random Color Array
var colorArray = ['#FF6633', '#FFB399', '#FF33FF', '#FFFF99', '#00B3E6',
'#E6B333', '#3366E6', '#999966', '#99FF99', '#B34D4D',
'#80B300', '#809900', '#E6B3B3', '#6680B3', '#66991A',
'#FF99E6', '#CCFF1A', '#FF1A66', '#E6331A', '#33FFCC',
'#66994D', '#B366CC', '#4D8000', '#B33300', '#CC80CC',
'#66664D', '#991AFF', '#E666FF', '#4DB3FF', '#1AB399',
'#E666B3', '#33991A', '#CC9999', '#B3B31A', '#00E680',
'#4D8066', '#809980', '#E6FF80', '#1AFF33', '#999933',
'#FF3380', '#CCCC00', '#66E64D', '#4D80CC', '#9900B3',
'#E64D66', '#4DB380', '#FF4D4D', '#99E6E6', '#6666FF'];
@saintianonavyie
Copy link

colorshow1 colorshow2 colorshow3 colorshow4 colorshow5 colorshow6 colorshow7
"#63B598", "#CE7D78", "#EA9E70", "#A48A9E", "#C6E1E8", "#648177", "#0D5AC1",
"#F205E6", "#1C0365", "#14A9AD", "#4CA2F9", "#A4E43F", "#D298E2", "#6119D0",
"#D2737D", "#C0A43C", "#F2510E", "#651BE6", "#79806E", "#61DA5E", "#CD2F00",
"#9348AF", "#01AC53", "#C5A4FB", "#996635", "#B11573", "#4BB473", "#75D89E",
"#2F3F94", "#2F7B99", "#DA967D", "#34891F", "#B0D87B", "#CA4751", "#7E50A8",
"#C4D647", "#E0EEB8", "#11DEC1", "#289812", "#566CA0", "#FFDBE1", "#2F1179",
"#935B6D", "#916988", "#513D98", "#AEAD3A", "#9E6D71", "#4B5BDC", "#0CD36D",
"#250662", "#CB5BEA", "#228916", "#AC3E1B", "#DF514A", "#539397", "#880977",
"#F697C1", "#BA96CE", "#679C9D", "#C6C42C", "#5D2C52", "#48B41B", "#E1CF3B",
"#5BE4F0", "#57C4D8", "#A4D17A", "#225B8", "#BE608B", "#96B00C", "#088BAF",
"#F158BF", "#E145BA", "#EE91E3", "#05D371", "#5426E0", "#4834D0", "#802234",
"#6749E8", "#0971F0", "#8FB413", "#B2B4F0", "#C3C89D", "#C9A941", "#41D158",
"#FB21A3", "#51AED9", "#5BB32D", "#807FB", "#21538E", "#89D534", "#D36647",
"#7FB411", "#0023B8", "#3B8C2A", "#986B53", "#F50422", "#983F7A", "#EA24A3",
"#79352C", "#521250", "#C79ED2", "#D6DD92", "#E33E52", "#B2BE57", "#FA06EC",
"#1BB699", "#6B2E5F", "#64820F", "#1C271", "#21538E", "#89D534", "#D36647",
"#7FB411", "#0023B8", "#3B8C2A", "#986B53", "#F50422", "#983F7A", "#EA24A3",
"#79352C", "#521250", "#C79ED2", "#D6DD92", "#E33E52", "#B2BE57", "#FA06EC",
"#1BB699", "#6B2E5F", "#64820F", "#1C271", "#9CB64A", "#996C48", "#9AB9B7",
"#06E052", "#E3A481", "#0EB621", "#FC458E", "#B2DB15", "#AA226D", "#792ED8",
"#73872A", "#520D3A", "#CEFCB8", "#A5B3D9", "#7D1D85", "#C4FD57", "#F1AE16",
"#8FE22A", "#EF6E3C", "#243EEB", "#1DC18", "#DD93FD", "#3F8473", "#E7DBCE",
"#421F79", "#7A3D93", "#635F6D", "#93F2D7", "#9B5C2A", "#15B9EE", "#0F5997",
"#409188", "#911E20", "#1350CE", "#10E5B1", "#FFF4D7", "#CB2582", "#CE00BE",
"#32D5D6", "#17232", "#608572", "#C79BC2", "#00F87C", "#77772A", "#6995BA",
"#FC6B57", "#F07815", "#8FD883", "#060E27", "#96E591", "#21D52E", "#D00043",
"#B47162", "#1EC227", "#4F0F6F", "#1D1D58", "#947002", "#BDE052", "#E08C56",
"#28FCFD", "#BB09B", "#36486A", "#D02E29", "#1AE6DB", "#3E464C", "#A84A8F",
"#911E7E", "#3F16D9", "#0F525F", "#AC7C0A", "#B4C086", "#C9D730", "#30CC49",
"#3D6751", "#FB4C03", "#640FC1", "#62C03E", "#D3493A", "#88AA0B", "#406DF9",
"#615AF0", "#4BE47", "#2A3434", "#4A543F", "#79BCA0", "#A8B8D4", "#00EFD4",
"#7AD236", "#7260D8", "#1DEAA7", "#06F43A", "#823C59", "#E3D94C", "#DC1C06",
"#F53B2A", "#B46238", "#2DFFF6", "#A82B89", "#1A8011", "#436A9F", "#1A806A",
"#4CF09D", "#C188A2", "#67EB4B", "#B308D3", "#FC7E41", "#AF3101", "#FF065",
"#71B1F4", "#A2F8A5", "#E23DD0", "#D3486D", "#00F7F9", "#474893", "#3CEC35",
"#1C65CB", "#5D1D0C", "#2D7D2A", "#FF3420", "#5CDD87", "#A259A4", "#E4AC44",
"#1BEDE6", "#8798A4", "#D7790F", "#B2C24F", "#DE73C2", "#D70A9C", "#25B67",
"#88E9B8", "#C2B0E2", "#86E98F", "#AE90E2", "#1A806B", "#436A9E", "#0EC0FF",
"#F812B3", "#B17FC9", "#8D6C2F", "#D3277A", "#2CA1AE", "#9685EB", "#8A96C6",
"#DBA2E6", "#76FC1B", "#608FA4", "#20F6BA", "#07D7F6", "#DCE77A", "#77ECCA"]

this is uppercase version of my initial post, for most of us that prefered it uppercase .

thank you,
Happy coding.

@chidimo
Copy link

chidimo commented Nov 10, 2020

Thank you... Didn't want to start generating random colours with JS

Lol.

@saintianonavyie
Copy link

saintianonavyie commented Nov 10, 2020 via email

@ashikhp
Copy link

ashikhp commented Dec 3, 2020

@Givemo
thanks man !

@FrontRowWithJ
Copy link

Thx!

@osmartinez
Copy link

very handy, thank you!😄

@chiji1
Copy link

chiji1 commented Feb 1, 2021

Yeap, just what I needed. Thanks

@prasanna16-12
Copy link

Yo.... reduce a lot code

@elfaz2
Copy link

elfaz2 commented May 19, 2021

Thanks

@thienvu97ht
Copy link

Thank bro 😄

@rahulraj-120799
Copy link

Thanks bro. useful

@ianwright27
Copy link

Thanks so much

@sajerestan1
Copy link

Hello All,

I am new to Javascript, I have gone past the initial stage. I am trying out some simple JS projects to improve my knowledge and I want to create a simple app that will allow me to display different colors by clicking a button. I plan on doing this by using an array. I want to display the actual colors, not the hex codes.

I would be forever grateful if anyone can come to my aid.

Thanks.

@Migaroez
Copy link

Hello All,

I am new to Javascript, I have gone past the initial stage. I am trying out some simple JS projects to improve my knowledge and I want to create a simple app that will allow me to display different colors by clicking a button. I plan on doing this by using an array. I want to display the actual colors, not the hex codes.

I would be forever grateful if anyone can come to my aid.

Thanks.

Javascript is used to manipulate data.
Use html/css to display the data for example: https://www.w3schools.com/cssref/pr_background-color.asp

@aldo-o
Copy link

aldo-o commented Nov 3, 2021

'#'+(Math.random()*0xFFFFFF<<0).toString(16)

Nice. Love it.

@kdssoftware
Copy link

wow, thanks a lot for. very handy!

@cloudfaction
Copy link

Excellent, thanks!

@mrskl21
Copy link

mrskl21 commented Jan 14, 2022

thanks, so helpful!

@curt4207
Copy link

Wow, Thx this is so helpful.❤️

@kaplego
Copy link

kaplego commented Feb 17, 2022

@Saadlulu here is a version without the 10 invalid hex :

[
    "#63b598", "#ce7d78", "#ea9e70", "#a48a9e", "#c6e1e8", "#648177", "#0d5ac1",
    "#f205e6", "#1c0365", "#14a9ad", "#4ca2f9", "#a4e43f", "#d298e2", "#6119d0",
    "#d2737d", "#c0a43c", "#f2510e", "#651be6", "#79806e", "#61da5e", "#cd2f00",
    "#9348af", "#01ac53", "#c5a4fb", "#996635", "#b11573", "#4bb473", "#75d89e",
    "#2f3f94", "#2f7b99", "#da967d", "#34891f", "#b0d87b", "#ca4751", "#7e50a8",
    "#c4d647", "#e0eeb8", "#11dec1", "#289812", "#566ca0", "#ffdbe1", "#2f1179",
    "#935b6d", "#916988", "#513d98", "#aead3a", "#9e6d71", "#4b5bdc", "#0cd36d",
    "#250662", "#cb5bea", "#228916", "#ac3e1b", "#df514a", "#539397", "#880977",
    "#f697c1", "#ba96ce", "#679c9d", "#c6c42c", "#5d2c52", "#48b41b", "#e1cf3b",
    "#5be4f0", "#57c4d8", "#a4d17a", "#be608b", "#96b00c", "#088baf", "#f158bf",
    "#e145ba", "#ee91e3", "#05d371", "#5426e0", "#4834d0", "#802234", "#6749e8",
    "#0971f0", "#8fb413", "#b2b4f0", "#c3c89d", "#c9a941", "#41d158", "#fb21a3",
    "#51aed9", "#5bb32d", "#21538e", "#89d534", "#d36647", "#7fb411", "#0023b8",
    "#3b8c2a", "#986b53", "#f50422", "#983f7a", "#ea24a3", "#79352c", "#521250",
    "#c79ed2", "#d6dd92", "#e33e52", "#b2be57", "#fa06ec", "#1bb699", "#6b2e5f",
    "#64820f", "#21538e", "#89d534", "#d36647", "#7fb411", "#0023b8", "#3b8c2a",
    "#986b53", "#f50422", "#983f7a", "#ea24a3", "#79352c", "#521250", "#c79ed2",
    "#d6dd92", "#e33e52", "#b2be57", "#fa06ec", "#1bb699", "#6b2e5f", "#64820f",
    "#9cb64a", "#996c48", "#9ab9b7", "#06e052", "#e3a481", "#0eb621", "#fc458e",
    "#b2db15", "#aa226d", "#792ed8", "#73872a", "#520d3a", "#cefcb8", "#a5b3d9",
    "#7d1d85", "#c4fd57", "#f1ae16", "#8fe22a", "#ef6e3c", "#243eeb", "#dd93fd",
    "#3f8473", "#e7dbce", "#421f79", "#7a3d93", "#635f6d", "#93f2d7", "#9b5c2a",
    "#15b9ee", "#0f5997", "#409188", "#911e20", "#1350ce", "#10e5b1", "#fff4d7",
    "#cb2582", "#ce00be", "#32d5d6", "#608572", "#c79bc2", "#00f87c", "#77772a",
    "#6995ba", "#fc6b57", "#f07815", "#8fd883", "#060e27", "#96e591", "#21d52e",
    "#d00043", "#b47162", "#1ec227", "#4f0f6f", "#1d1d58", "#947002", "#bde052",
    "#e08c56", "#28fcfd", "#36486a", "#d02e29", "#1ae6db", "#3e464c", "#a84a8f",
    "#911e7e", "#3f16d9", "#0f525f", "#ac7c0a", "#b4c086", "#c9d730", "#30cc49",
    "#3d6751", "#fb4c03", "#640fc1", "#62c03e", "#d3493a", "#88aa0b", "#406df9",
    "#615af0", "#2a3434", "#4a543f", "#79bca0", "#a8b8d4", "#00efd4", "#7ad236",
    "#7260d8", "#1deaa7", "#06f43a", "#823c59", "#e3d94c", "#dc1c06", "#f53b2a",
    "#b46238", "#2dfff6", "#a82b89", "#1a8011", "#436a9f", "#1a806a", "#4cf09d",
    "#c188a2", "#67eb4b", "#b308d3", "#fc7e41", "#af3101", "#71b1f4", "#a2f8a5",
    "#e23dd0", "#d3486d", "#00f7f9", "#474893", "#3cec35", "#1c65cb", "#5d1d0c",
    "#2d7d2a", "#ff3420", "#5cdd87", "#a259a4", "#e4ac44", "#1bede6", "#8798a4",
    "#d7790f", "#b2c24f", "#de73c2", "#d70a9c", "#88e9b8", "#c2b0e2", "#86e98f",
    "#ae90e2", "#1a806b", "#436a9e", "#0ec0ff", "#f812b3", "#b17fc9", "#8d6c2f",
    "#d3277a", "#2ca1ae", "#9685eb", "#8a96c6", "#dba2e6", "#76fc1b", "#608fa4",
    "#20f6ba", "#07d7f6", "#dce77a", "#77ecca"
]

@kxnyshk
Copy link

kxnyshk commented Apr 25, 2022

here is an extended version :)

colors: [ "#63b598", "#ce7d78", "#ea9e70", "#a48a9e", "#c6e1e8", "#648177" ,"#0d5ac1" , "#f205e6" ,"#1c0365" ,"#14a9ad" ,"#4ca2f9" ,"#a4e43f" ,"#d298e2" ,"#6119d0", "#d2737d" ,"#c0a43c" ,"#f2510e" ,"#651be6" ,"#79806e" ,"#61da5e" ,"#cd2f00" , "#9348af" ,"#01ac53" ,"#c5a4fb" ,"#996635","#b11573" ,"#4bb473" ,"#75d89e" , "#2f3f94" ,"#2f7b99" ,"#da967d" ,"#34891f" ,"#b0d87b" ,"#ca4751" ,"#7e50a8" , "#c4d647" ,"#e0eeb8" ,"#11dec1" ,"#289812" ,"#566ca0" ,"#ffdbe1" ,"#2f1179" , "#935b6d" ,"#916988" ,"#513d98" ,"#aead3a", "#9e6d71", "#4b5bdc", "#0cd36d", "#250662", "#cb5bea", "#228916", "#ac3e1b", "#df514a", "#539397", "#880977", "#f697c1", "#ba96ce", "#679c9d", "#c6c42c", "#5d2c52", "#48b41b", "#e1cf3b", "#5be4f0", "#57c4d8", "#a4d17a", "#225b8", "#be608b", "#96b00c", "#088baf", "#f158bf", "#e145ba", "#ee91e3", "#05d371", "#5426e0", "#4834d0", "#802234", "#6749e8", "#0971f0", "#8fb413", "#b2b4f0", "#c3c89d", "#c9a941", "#41d158", "#fb21a3", "#51aed9", "#5bb32d", "#807fb", "#21538e", "#89d534", "#d36647", "#7fb411", "#0023b8", "#3b8c2a", "#986b53", "#f50422", "#983f7a", "#ea24a3", "#79352c", "#521250", "#c79ed2", "#d6dd92", "#e33e52", "#b2be57", "#fa06ec", "#1bb699", "#6b2e5f", "#64820f", "#1c271", "#21538e", "#89d534", "#d36647", "#7fb411", "#0023b8", "#3b8c2a", "#986b53", "#f50422", "#983f7a", "#ea24a3", "#79352c", "#521250", "#c79ed2", "#d6dd92", "#e33e52", "#b2be57", "#fa06ec", "#1bb699", "#6b2e5f", "#64820f", "#1c271", "#9cb64a", "#996c48", "#9ab9b7", "#06e052", "#e3a481", "#0eb621", "#fc458e", "#b2db15", "#aa226d", "#792ed8", "#73872a", "#520d3a", "#cefcb8", "#a5b3d9", "#7d1d85", "#c4fd57", "#f1ae16", "#8fe22a", "#ef6e3c", "#243eeb", "#1dc18", "#dd93fd", "#3f8473", "#e7dbce", "#421f79", "#7a3d93", "#635f6d", "#93f2d7", "#9b5c2a", "#15b9ee", "#0f5997", "#409188", "#911e20", "#1350ce", "#10e5b1", "#fff4d7", "#cb2582", "#ce00be", "#32d5d6", "#17232", "#608572", "#c79bc2", "#00f87c", "#77772a", "#6995ba", "#fc6b57", "#f07815", "#8fd883", "#060e27", "#96e591", "#21d52e", "#d00043", "#b47162", "#1ec227", "#4f0f6f", "#1d1d58", "#947002", "#bde052", "#e08c56", "#28fcfd", "#bb09b", "#36486a", "#d02e29", "#1ae6db", "#3e464c", "#a84a8f", "#911e7e", "#3f16d9", "#0f525f", "#ac7c0a", "#b4c086", "#c9d730", "#30cc49", "#3d6751", "#fb4c03", "#640fc1", "#62c03e", "#d3493a", "#88aa0b", "#406df9", "#615af0", "#4be47", "#2a3434", "#4a543f", "#79bca0", "#a8b8d4", "#00efd4", "#7ad236", "#7260d8", "#1deaa7", "#06f43a", "#823c59", "#e3d94c", "#dc1c06", "#f53b2a", "#b46238", "#2dfff6", "#a82b89", "#1a8011", "#436a9f", "#1a806a", "#4cf09d", "#c188a2", "#67eb4b", "#b308d3", "#fc7e41", "#af3101", "#ff065", "#71b1f4", "#a2f8a5", "#e23dd0", "#d3486d", "#00f7f9", "#474893", "#3cec35", "#1c65cb", "#5d1d0c", "#2d7d2a", "#ff3420", "#5cdd87", "#a259a4", "#e4ac44", "#1bede6", "#8798a4", "#d7790f", "#b2c24f", "#de73c2", "#d70a9c", "#25b67", "#88e9b8", "#c2b0e2", "#86e98f", "#ae90e2", "#1a806b", "#436a9e", "#0ec0ff", "#f812b3", "#b17fc9", "#8d6c2f", "#d3277a", "#2ca1ae", "#9685eb", "#8a96c6", "#dba2e6", "#76fc1b", "#608fa4", "#20f6ba", "#07d7f6", "#dce77a", "#77ecca"]

wow this came in really handy! thanks man :) @Saadlulu

@JohannesSattler
Copy link

JohannesSattler commented May 31, 2022

@N3moAhead
Copy link

Thats super nice thanks 👍

@Sivaumashankar
Copy link

thanks for array of colors dueds

@egin10
Copy link

egin10 commented Jun 6, 2024

Thank's a lot 🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment