How to implement a color generator in a website

Ionic Framework
1

I want to implement this color Generator that show in the documantion under the title New Color Creator

The idea is, that the user can choose a color that would be save on database and then written to the css file to use the new color-class.

2

I’m not sure what you mean by “save on database”, but you can’t modify source files like CSS at runtime. What you can do is to use DomController to write a style element and manually insert it into the document’s head.

3

yes i know, i dont want to change that on runtime. At the moment a have a simple color picker, but for the ionic framework i need all the other styles for the color:

:root {
  --ion-color-new: #69bb7b;
  --ion-color-new-rgb: 105,187,123;
  --ion-color-new-contrast: #ffffff;
  --ion-color-new-contrast-rgb: 255,255,255;
  --ion-color-new-shade: #5ca56c;
  --ion-color-new-tint: #78c288;
}

.ion-color-new {
  --ion-color-base: var(--ion-color-new);
  --ion-color-base-rgb: var(--ion-color-new-rgb);
  --ion-color-contrast: var(--ion-color-new-contrast);
  --ion-color-contrast-rgb: var(--ion-color-new-contrast-rgb);
  --ion-color-shade: var(--ion-color-new-shade);
  --ion-color-tint: var(--ion-color-new-tint);
}

Or it is possible that to generate from a color hex code?
4

Use the source, Luke.

1 Like
5

:smile: thanks a lot Yoda :yum: