diff --git a/README.md b/README.md
index bb500c8..40246df 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-# MD Composer Extras
+# MD Composer ~~Extras~~ Color Plus Ultra
 
 This Discourse theme component adds formatting options to your Discourse composer.
 
@@ -7,11 +7,12 @@ This Discourse theme component adds formatting options to your Discourse compose
 * superscript
 * subscript
 * center
-* align right
+* ~~align right~~
 * justify
-* float left
-* float right
-* columns.
+* ~~float left~~
+* ~~float right~~
+* ~~columns~~.
+* Colorer le texte en bleu, rose, jaune, orange, rouge et vert.
 
 These additions are responsive for desktops and phones, but not for horizon orientation or tablets. These additions have taken into consideration [Slick](https://github.com/discourse/Discourse-Slick-image-gallery), [Tiles](https://github.com/discourse/Discourse-Tiles-image-gallery), and [Events](https://github.com/angusmcleod/discourse-events) when determining what should be placed on the composer bar or in the composer pop out menu.
 
@@ -63,3 +64,5 @@ I took some parts of the Iconified Header Links and Slick Image Gallery theme co
 
 https://meta.discourse.org/t/iconified-header-links/86307 (adding fa5 icons in the theme component)
 https://meta.discourse.org/t/slick-image-gallery/81952 (manager the translations inside the theme component)
+
+Modification de la branche `color` pour l'ajout de couleurs prédéfinies par l'association Camélia Studio : https://camelia-studio.org
\ No newline at end of file
diff --git a/desktop/head_tag.html b/desktop/head_tag.html
index 3697360..4eb6448 100644
--- a/desktop/head_tag.html
+++ b/desktop/head_tag.html
@@ -41,14 +41,6 @@ api.onToolbarCreate(toolbar => {
         perform: e => e.applySurround('[wrap="center"]\n', '\n[/wrap]', 'align_center_text')
     });
 });
-api.onToolbarCreate(toolbar => {
-    toolbar.addButton({
-        id: "align_right_button",
-        group: "extras",
-        icon: "align-right",
-        perform: e => e.applySurround('[wrap="right"]\n', '\n[/wrap]', 'align_right_text')
-    });
-});
 api.onToolbarCreate(toolbar => {
     toolbar.addButton({
         id: "align_justify_button",
@@ -59,20 +51,70 @@ api.onToolbarCreate(toolbar => {
 });
 
 // EXTRAS
-api.addComposerToolbarPopupMenuOption({
-  action: (toolbarEvent) => {
-    toolbarEvent.applySurround('[wrap="floatl"]\n', '\n[/wrap]', "float_left_text");
-  },
-  icon: 'indent',
-  label: 'float_left_button',
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "bleucolor",
+      icon: "palette",
+      label: "bleu_color_button"
+  };
+});
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "rosecolor",
+      icon: "palette",
+      label: "rose_color_button"
+  };
+});
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "jaunecolor",
+      icon: "palette",
+      label: "jaune_color_button"
+  };
+});
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "orangecolor",
+      icon: "palette",
+      label: "orange_color_button"
+  };
+});
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "rougecolor",
+      icon: "palette",
+      label: "rouge_color_button"
+  };
+});
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "vertcolor",
+      icon: "palette",
+      label: "vert_color_button"
+  };
 });
 
-api.addComposerToolbarPopupMenuOption({
-  action: (toolbarEvent) => {
-    toolbarEvent.applySurround('[wrap="columns"]\n', '\n[/wrap]', "columns_text");
-  },
-  icon: 'columns',
-  label: 'columns_button',
+api.modifyClass("controller:composer", {
+  actions: {
+    bleucolor() {
+      this.get("toolbarEvent").applySurround('[color=#068EEF]', '[/color]', "bleu_color_text");
+    },
+    rosecolor() {
+      this.get("toolbarEvent").applySurround('[color=#EF06A0]', '[/color]', "rose_color_text");
+    },
+    jaunecolor() {
+      this.get("toolbarEvent").applySurround('[color=#EFC906]', '[/color]', "jaune_color_text");
+    },
+    orangecolor() {
+      this.get("toolbarEvent").applySurround('[color=#EF8806]', '[/color]', "orange_color_text");
+    },
+    rougecolor() {
+      this.get("toolbarEvent").applySurround('[color=#EF0606]', '[/color]', "rouge_color_text");
+    },
+    vertcolor() {
+      this.get("toolbarEvent").applySurround('[color=#2A821C]', '[/color]', "vert_color_text");
+    },
+  }
 });
 
 // TEXTS
@@ -92,10 +134,6 @@ translations.composer.align_center_button_title = settings.align_center_button;
 translations.composer.align_center_text =
   settings.align_center_text;
 
-translations.composer.align_right_button_title = settings.align_right_button;
-translations.composer.align_right_text =
-  settings.align_right_text;
-
 translations.composer.align_justify_button_title = settings.align_justify_button;
 translations.composer.align_justify_text =
   settings.align_justify_text;
@@ -112,12 +150,28 @@ translations.composer.subscript_button_title = settings.subscript_button;
 translations.composer.subscript_text =
   settings.subscript_text;
 
-translations.columns_button = settings.columns_button;
-translations.composer.columns_text =
-  settings.columns_text;
+translations.composer.bleu_color_button_title = settings.bleu_color_button;
+translations.composer.bleu_color_text =
+  settings.bleu_color_text;
 
-translations.float_left_button = settings.float_left_button;
-translations.composer.float_left_text =
-  settings.float_left_text;
+translations.composer.rose_color_button_title = settings.rose_color_button;
+translations.composer.rose_color_text =
+  settings.rose_color_text;
+
+translations.composer.jaune_color_button_title = settings.jaune_color_button;
+translations.composer.jaune_color_text =
+  settings.jaune_color_text;
+
+translations.composer.orange_color_button_title = settings.orange_color_button;
+translations.composer.orange_color_text =
+  settings.orange_color_text;
+
+translations.composer.rouge_color_button_title = settings.rouge_color_button;
+translations.composer.rouge_color_text =
+  settings.rouge_color_text;
+
+translations.composer.vert_color_button_title = settings.vert_color_button;
+translations.composer.vert_color_text =
+  settings.vert_color_text;
  
 </script>
diff --git a/mobile/head_tag.html b/mobile/head_tag.html
index c90b72e..a4565b1 100644
--- a/mobile/head_tag.html
+++ b/mobile/head_tag.html
@@ -61,18 +61,26 @@ api.addToolbarPopupMenuOptionsCallback(() => {
   };
 });
 
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "bbcodecolor",
+      icon: "palette",
+      label: "bbcode_color_button"
+  };
+});
+
 api.modifyClass("controller:composer", {
   actions: {
     strikethrough() {
       this.get("toolbarEvent").applySurround("<s>", "</s>", "strikethrough_text");
     },
-	superscript() {
-      this.get("toolbarEvent").applySurround("<sup>", "</sup>", "superscript_text");
+    superscript() {
+      this.get("toolbarEvent").applySurround("<sup>", "</sub>", "superscript_text");
     },
     subscript() {
       this.get("toolbarEvent").applySurround("<sub>", "</sub>", "subscript_text");
     },
-	aligncenter() {
+    aligncenter() {
       this.get("toolbarEvent").applySurround('[wrap="center"]\n', '\n[/wrap]', "align_center_text");
     },
     alignright() {
@@ -83,6 +91,9 @@ api.modifyClass("controller:composer", {
     },
     floatleft() {
       this.get("toolbarEvent").applySurround('[wrap="floatl"]\n', '\n[/wrap]', "float_left_text");
+    },
+    bbcodecolor() {
+      this.get("toolbarEvent").applySurround('[color=#222]', '[/color]', "bbcode_color_text");
     }
   }
 });
@@ -131,5 +142,9 @@ translations.composer.columns_text =
 translations.float_left_button = settings.float_left_button;
 translations.composer.float_left_text =
   settings.float_left_text;
+  
+translations.bbcode_color_button = settings.bbcode_color_button;
+translations.composer.bbcode_color_text =
+  settings.bbcode_color_text;
  
 </script>
diff --git a/settings.yml b/settings.yml
index 2382838..c85c9fd 100644
--- a/settings.yml
+++ b/settings.yml
@@ -1,79 +1,128 @@
 underline_button:
-  default: "Underline"
+  default: "Souligner"
   description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
     en: Enter the text for the title of the button in the composer.
 underline_text:
-  default: "Text"
+  default: "Texte"
   description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
     en: Enter the placeholder text that appears in the composer after the user clicks the button.
 align_center_button:
-  default: "Center"
+  default: "Centrer"
   description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
     en: Enter the text for the title of the button in the composer.
 align_center_text:
-  default: "Text"
-  description:
-    en: Enter the placeholder text that appears in the composer after the user clicks the button.
-align_right_button:
-  default: "Align right"
-  description:
-    en: Enter the text for the title of the button in the composer.
-align_right_text:
-  default: "Text"
+  default: "Texte"
   description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
     en: Enter the placeholder text that appears in the composer after the user clicks the button.
 align_justify_button:
-  default: "Justify"
+  default: "Justifier"
   description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
     en: Enter the text for the title of the button in the composer.
 align_justify_text:
-  default: "Text"
+  default: "Texte"
   description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
     en: Enter the placeholder text that appears in the composer after the user clicks the button.
 strikethrough_button:
-  default: "Strike-through"
+  default: "Barrer"
   description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
     en: Enter the text for the title of the button in the composer.
 strikethrough_text:
-  default: "Text"
-  description:
-    en: Enter the placeholder text that appears in the composer after the user clicks the button.
-float_left_button:
-  default: "Float left"
-  description:
-    en: Enter the text for the title of the button in the composer.
-float_left_text:
-  default: "Text"
+  default: "Texte"
   description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
     en: Enter the placeholder text that appears in the composer after the user clicks the button.
 superscript_button:
-  default: "Superscript"
+  default: "Exposant"
   description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
     en: Enter the text for the title of the button in the composer.
 superscript_text:
-  default: "Text"
+  default: "Texte"
   description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
     en: Enter the placeholder text that appears in the composer after the user clicks the button.
 subscript_button:
-  default: "Subscript"
+  default: "Indice"
   description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
     en: Enter the text for the title of the button in the composer.
 subscript_text:
-  default: "Text"
+  default: "Texte"
   description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
     en: Enter the placeholder text that appears in the composer after the user clicks the button.
-columns_button:
-  default: "Columns"
+bleu_color_button:
+  default: "Colorer en bleu"
   description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
     en: Enter the text for the title of the button in the composer.
-columns_text:
-  default: "Use the closing tag to mark where the first column ends. The second column will autobreak."
+bleu_color_text:
+  default: "Texte"
   description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
+    en: Enter the placeholder text that appears in the composer after the user clicks the button.
+rose_color_button:
+  default: "Colorer en rose"
+  description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
+    en: Enter the text for the title of the button in the composer.
+rose_color_text:
+  default: "Texte"
+  description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
+    en: Enter the placeholder text that appears in the composer after the user clicks the button.
+jaune_color_button:
+  default: "Colorer en jaune"
+  description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
+    en: Enter the text for the title of the button in the composer.
+jaune_color_text:
+  default: "Texte"
+  description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
+    en: Enter the placeholder text that appears in the composer after the user clicks the button.
+orange_color_button:
+  default: "Colorer en orange"
+  description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
+    en: Enter the text for the title of the button in the composer.
+orange_color_text:
+  default: "Texte"
+  description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
+    en: Enter the placeholder text that appears in the composer after the user clicks the button.
+rouge_color_button:
+  default: "Colorer en rouge"
+  description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
+    en: Enter the text for the title of the button in the composer.
+rouge_color_text:
+  default: "Texte"
+  description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
+    en: Enter the placeholder text that appears in the composer after the user clicks the button.
+vert_color_button:
+  default: "Colorer en vert"
+  description:
+    fr: Saisissez le texte du titre du bouton dans le compositeur.
+    en: Enter the text for the title of the button in the composer.
+vert_color_text:
+  default: "Texte"
+  description:
+    fr: Saisissez le texte de remplacement qui apparaît dans le compositeur après que l'utilisateur ait cliqué sur le bouton.
     en: Enter the placeholder text that appears in the composer after the user clicks the button.
 
 Svg_icons: 
   type: 'list'
   list_type: 'compact'
-  default: 'fa-align-center|fa-align-right|fa-align-justify|fa-strikethrough|fa-underline|fa-indent|fa-columns|fa-superscript|fa-subscript'
+  default: 'fa-align-center|fa-align-justify|fa-strikethrough|fa-underline|fa-indent|fa-superscript|fa-subscript|fa-palette'
   description: 
+    fr: "Inclure les classes d'icônes FontAwesome 5 pour chaque icône utilisée dans la liste."
     en: "Include FontAwesome 5 icon classes for each icon used in the list."