JavaScript color gradients can be created using CSS properties such as 'linear-gradient' or 'radial-gradient'. These gradients are used to transition between multiple colors smoothly. They are commonly applied to backgrounds, borders, and text shadows in web design.