[JQuery] Génération de couleur à partir d'une couleur de base

**The Vandals** · 25/11/2008, 15h26

Bonjour,

Je voudrais etre capable de générer des couleur en jouant avec la luminosité, à partir d'une couleur de base dans mon css.
De cette manière je n'aurais qu'a modifier la couleur de base et tout mes div utiliserais des ton différent de la même couleur.
Je ne sais pas si quelqu'un d'entre vous a déjà fait quelque chose du genre, ou peu m'aider à le faire, car je ne sait pas trop comment m'y prendre.

Merci

**SpaceFrog** · 25/11/2008, 15h37

tu peux jouer sur le rgb ... en modifiant les parmètres R G B
sinon j'ai déja vu des script qui jouent sur les valeurs hexa ... masi bon c'est un peu plus complexe ...

tiens j'ai retrouvé un vieux bout de code tu peux t'en inspirer :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
 
<html> 
<head> 
<title>Modification dynamique de la couleur d'arrière-plan</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
 
<script language="JavaScript"> 
<!-- 
function hex(dec) { 
  hx = (dec < 16) ? "0" + dec.toString(16).toUpperCase() : dec.toString(16).toUpperCase(); 
  return hx; 
} 
function updt(variation) { 
  this.red = ((this.red + variation[0] <= 255) && (this.red + variation[0] > 0)) ? this.red + variation[0] : this.red - variation[0]; 
  this.green = ((this.green + variation[1] <= 255) && (this.green + variation[1] > 0)) ? this.green + variation[1] : this.green - variation[1]; 
  this.blue = ((this.blue + variation[2] <= 255) && (this.blue + variation[2] > 0)) ? this.blue + variation[2] : this.blue - variation[2]; 
  document.bgColor = '#'+hex(this.red)+hex(this.green)+hex(this.blue); 
} 
function bgcol(r, g, b) { 
  this.red = r; 
  this.green = g; 
  this.blue = b; 
  this.updt = updt; 
} 
function direction() { 
  dir = new Array(parseInt(Math.random()*3)-1, parseInt(Math.random()*3)-1, parseInt(Math.random()*3)-1); 
  setTimeout("direction()", 2500); 
} 
function disco() { 
  direction(); 
  coul = new bgcol(255, 128, 64); 
  setInterval("coul.updt(dir)", 50); 
} 
--> 
</script> 
 
</head> 
 
<body onload="disco()" bgcolor="#BCCADB"> 
</body> 
</html>

Pour ce qui est de rester dasn les mêem tons il va falloir regarder du coté des tutos de graphistes pour voie comment faire varier les r g et b

**The Vandals** · 25/11/2008, 21h12

Merci beaucoup pour le code,
Je vais l'utiliser et pour ce qui est du ton, j'ai trouver l'algorithme pour convertir de HSL en RGB et vice versa, je vais donc prendre mon RGB le convertir en HSL ajouter 20 au L et le reconvertir en RGB.

**Sub0** · 30/11/2008, 16h50

► DEMO PALETTE RGB

► SOURCE JS

[JQuery] Génération de couleur à partir d'une couleur de base

jQuery

Vue hybride

Discussions similaires

Partager

Partager