8
0
Просмотр исходного кода

Merge branch 'master' into t/ckeditor5/1655

Kamil Piechaczek 6 лет назад
Родитель
Сommit
29603d0cb0
100 измененных файлов с 4910 добавлено и 85 удалено
  1. 1 1
      packages/ckeditor5-font/.eslintrc.js
  2. 1 5
      packages/ckeditor5-font/.travis.yml
  3. 13 0
      packages/ckeditor5-font/CHANGELOG.md
  4. 6 1
      packages/ckeditor5-font/README.md
  5. 1 1
      packages/ckeditor5-font/docs/_snippets/features/build-font-source.js
  6. 3 0
      packages/ckeditor5-font/docs/_snippets/features/custom-font-color-and-background-color-options.html
  7. 209 0
      packages/ckeditor5-font/docs/_snippets/features/custom-font-color-and-background-color-options.js
  8. 1 1
      packages/ckeditor5-font/docs/_snippets/features/custom-font-family-options.js
  9. 1 1
      packages/ckeditor5-font/docs/_snippets/features/custom-font-size-named-options.js
  10. 1 1
      packages/ckeditor5-font/docs/_snippets/features/custom-font-size-numeric-options.js
  11. 8 0
      packages/ckeditor5-font/docs/_snippets/features/font.html
  12. 12 2
      packages/ckeditor5-font/docs/_snippets/features/font.js
  13. 5 2
      packages/ckeditor5-font/docs/api/font.md
  14. 142 1
      packages/ckeditor5-font/docs/features/font.md
  15. 19 1
      packages/ckeditor5-font/lang/contexts.json
  16. 72 0
      packages/ckeditor5-font/lang/translations/ar.po
  17. 72 0
      packages/ckeditor5-font/lang/translations/az.po
  18. 72 0
      packages/ckeditor5-font/lang/translations/ca.po
  19. 72 0
      packages/ckeditor5-font/lang/translations/cs.po
  20. 72 0
      packages/ckeditor5-font/lang/translations/de.po
  21. 72 0
      packages/ckeditor5-font/lang/translations/en-au.po
  22. 72 0
      packages/ckeditor5-font/lang/translations/en.po
  23. 72 0
      packages/ckeditor5-font/lang/translations/es.po
  24. 72 0
      packages/ckeditor5-font/lang/translations/et.po
  25. 72 0
      packages/ckeditor5-font/lang/translations/fa.po
  26. 72 0
      packages/ckeditor5-font/lang/translations/fr.po
  27. 72 0
      packages/ckeditor5-font/lang/translations/gl.po
  28. 72 0
      packages/ckeditor5-font/lang/translations/he.po
  29. 72 0
      packages/ckeditor5-font/lang/translations/hr.po
  30. 72 0
      packages/ckeditor5-font/lang/translations/hu.po
  31. 72 0
      packages/ckeditor5-font/lang/translations/id.po
  32. 72 0
      packages/ckeditor5-font/lang/translations/it.po
  33. 72 0
      packages/ckeditor5-font/lang/translations/ku.po
  34. 72 0
      packages/ckeditor5-font/lang/translations/nb.po
  35. 72 0
      packages/ckeditor5-font/lang/translations/ne.po
  36. 72 0
      packages/ckeditor5-font/lang/translations/nl.po
  37. 72 0
      packages/ckeditor5-font/lang/translations/no.po
  38. 72 0
      packages/ckeditor5-font/lang/translations/pl.po
  39. 72 0
      packages/ckeditor5-font/lang/translations/pt-br.po
  40. 72 0
      packages/ckeditor5-font/lang/translations/pt.po
  41. 72 0
      packages/ckeditor5-font/lang/translations/ru.po
  42. 72 0
      packages/ckeditor5-font/lang/translations/sk.po
  43. 72 0
      packages/ckeditor5-font/lang/translations/sq.po
  44. 78 6
      packages/ckeditor5-font/lang/translations/sr-latn.po
  45. 77 5
      packages/ckeditor5-font/lang/translations/sr.po
  46. 72 0
      packages/ckeditor5-font/lang/translations/sv.po
  47. 72 0
      packages/ckeditor5-font/lang/translations/tr.po
  48. 72 0
      packages/ckeditor5-font/lang/translations/uk.po
  49. 72 0
      packages/ckeditor5-font/lang/translations/zh-cn.po
  50. 8 8
      packages/ckeditor5-font/package.json
  51. 6 2
      packages/ckeditor5-font/src/font.js
  52. 142 0
      packages/ckeditor5-font/src/fontbackgroundcolor.js
  53. 31 0
      packages/ckeditor5-font/src/fontbackgroundcolor/fontbackgroundcolorcommand.js
  54. 123 0
      packages/ckeditor5-font/src/fontbackgroundcolor/fontbackgroundcolorediting.js
  55. 40 0
      packages/ckeditor5-font/src/fontbackgroundcolor/fontbackgroundcolorui.js
  56. 141 0
      packages/ckeditor5-font/src/fontcolor.js
  57. 30 0
      packages/ckeditor5-font/src/fontcolor/fontcolorcommand.js
  58. 123 0
      packages/ckeditor5-font/src/fontcolor/fontcolorediting.js
  59. 40 0
      packages/ckeditor5-font/src/fontcolor/fontcolorui.js
  60. 1 1
      packages/ckeditor5-font/src/fontcommand.js
  61. 1 1
      packages/ckeditor5-font/src/fontfamily.js
  62. 3 2
      packages/ckeditor5-font/src/fontfamily/fontfamilycommand.js
  63. 3 4
      packages/ckeditor5-font/src/fontfamily/fontfamilyediting.js
  64. 6 5
      packages/ckeditor5-font/src/fontfamily/fontfamilyui.js
  65. 1 1
      packages/ckeditor5-font/src/fontfamily/utils.js
  66. 1 1
      packages/ckeditor5-font/src/fontsize.js
  67. 3 2
      packages/ckeditor5-font/src/fontsize/fontsizecommand.js
  68. 3 4
      packages/ckeditor5-font/src/fontsize/fontsizeediting.js
  69. 7 6
      packages/ckeditor5-font/src/fontsize/fontsizeui.js
  70. 1 1
      packages/ckeditor5-font/src/fontsize/utils.js
  71. 196 0
      packages/ckeditor5-font/src/ui/colortableview.js
  72. 123 0
      packages/ckeditor5-font/src/ui/colorui.js
  73. 173 1
      packages/ckeditor5-font/src/utils.js
  74. 5 3
      packages/ckeditor5-font/tests/font.js
  75. 18 0
      packages/ckeditor5-font/tests/fontbackgroundcolor.js
  76. 34 0
      packages/ckeditor5-font/tests/fontbackgroundcolor/fontbackgroundcolorcommand.js
  77. 263 0
      packages/ckeditor5-font/tests/fontbackgroundcolor/fontbackgroundcoloreditng.js
  78. 49 0
      packages/ckeditor5-font/tests/fontbackgroundcolor/fontbackgroundcolorui.js
  79. 18 0
      packages/ckeditor5-font/tests/fontcolor.js
  80. 34 0
      packages/ckeditor5-font/tests/fontcolor/fontcolorcommand.js
  81. 259 0
      packages/ckeditor5-font/tests/fontcolor/fontcolorediting.js
  82. 49 0
      packages/ckeditor5-font/tests/fontcolor/fontcolorui.js
  83. 1 1
      packages/ckeditor5-font/tests/fontcommand.js
  84. 1 1
      packages/ckeditor5-font/tests/fontfamily.js
  85. 1 1
      packages/ckeditor5-font/tests/fontfamily/fontfamilycommand.js
  86. 7 1
      packages/ckeditor5-font/tests/fontfamily/fontfamilyediting.js
  87. 1 1
      packages/ckeditor5-font/tests/fontfamily/fontfamilyui.js
  88. 1 1
      packages/ckeditor5-font/tests/fontfamily/utils.js
  89. 1 1
      packages/ckeditor5-font/tests/fontsize.js
  90. 1 1
      packages/ckeditor5-font/tests/fontsize/fontsizecommand.js
  91. 7 1
      packages/ckeditor5-font/tests/fontsize/fontsizeediting.js
  92. 1 1
      packages/ckeditor5-font/tests/fontsize/fontsizeui.js
  93. 1 1
      packages/ckeditor5-font/tests/fontsize/integration.js
  94. 1 1
      packages/ckeditor5-font/tests/fontsize/utils.js
  95. 12 0
      packages/ckeditor5-font/tests/manual/font-color.html
  96. 40 0
      packages/ckeditor5-font/tests/manual/font-color.js
  97. 14 0
      packages/ckeditor5-font/tests/manual/font-color.md
  98. 1 1
      packages/ckeditor5-font/tests/manual/font-family.js
  99. 1 1
      packages/ckeditor5-font/tests/manual/font-size-numeric.js
  100. 1 1
      packages/ckeditor5-font/tests/manual/font-size-presets.js

+ 1 - 1
packages/ckeditor5-font/.eslintrc.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* eslint-env node */

+ 1 - 5
packages/ckeditor5-font/.travis.yml

@@ -1,12 +1,8 @@
 sudo: required
 dist: trusty
 addons:
+  chrome: stable
   firefox: latest
-  apt:
-    sources:
-    - google-chrome
-    packages:
-    - google-chrome-stable
 language: node_js
 node_js:
 - '8'

+ 13 - 0
packages/ckeditor5-font/CHANGELOG.md

@@ -1,6 +1,19 @@
 Changelog
 =========
 
+## [11.1.0](https://github.com/ckeditor/ckeditor5-font/compare/v11.0.0...v11.1.0) (2019-04-10)
+
+### Features
+
+* Introduced font color and font background color features. Closes [ckeditor/ckeditor5#1457](https://github.com/ckeditor/ckeditor5/issues/1457). ([c456b2a](https://github.com/ckeditor/ckeditor5-font/commit/c456b2a))
+* Marked font size and font family as a formatting attribute using the `AttributeProperties#isFormatting` property. Closes [ckeditor/ckeditor5#1664](https://github.com/ckeditor/ckeditor5/issues/1664). ([d9f0a51](https://github.com/ckeditor/ckeditor5-font/commit/d9f0a51))
+
+### Other changes
+
+* Optimized icons. ([47ca23f](https://github.com/ckeditor/ckeditor5-font/commit/47ca23f))
+* Updated translations. ([6f3332f](https://github.com/ckeditor/ckeditor5-font/commit/6f3332f)) ([f756b70](https://github.com/ckeditor/ckeditor5-font/commit/f756b70))
+
+
 ## [11.0.0](https://github.com/ckeditor/ckeditor5-font/compare/v10.0.4...v11.0.0) (2019-02-28)
 
 ### Other changes

+ 6 - 1
packages/ckeditor5-font/README.md

@@ -10,7 +10,12 @@ CKEditor 5 font feature
 [![Dependency Status](https://david-dm.org/ckeditor/ckeditor5-font/status.svg)](https://david-dm.org/ckeditor/ckeditor5-font)
 [![devDependency Status](https://david-dm.org/ckeditor/ckeditor5-font/dev-status.svg)](https://david-dm.org/ckeditor/ckeditor5-font?type=dev)
 
-This package implements font size and font family support for CKEditor 5.
+This package implements support for the following CKEditor 5 features:
+
+* font size,
+* font family,
+* font color,
+* font background color.
 
 ## Demo
 

+ 1 - 1
packages/ckeditor5-font/docs/_snippets/features/build-font-source.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals window */

+ 3 - 0
packages/ckeditor5-font/docs/_snippets/features/custom-font-color-and-background-color-options.html

@@ -0,0 +1,3 @@
+<div id="snippet-custom-font-color-and-background-color-options">
+	<p><span style="color:yellow;background-color:hsl(0,0%,0%);">Text</span> in this <span style="color:white;background-color:hsl(0,100%,50%);">sample</span> <span style="color:aqua;background-color:hsl(240,100%,50%);">has</span> <span style="color:lime;background-color:hsl(300,100%,20%);">m</span><span style="color:lime;background-color:hsl(300,100%,30%);">u</span><span style="color:lime;background-color:hsl(300,100%,40%);">l</span><span style="background-color:hsl(300,100%,50%);">t</span><span style="background-color:hsl(300,100%,60%);">i</span><span style="background-color:hsl(300,100%,70%);">p</span><span style="background-color:hsl(300,100%,80%);">l</span><span style="background-color:hsl(300,100%,90%);">e</span> <span style="color:purple;">font colors</span> and <span style="background-color:hsl(120,100%,90%);">font background</span> <span style="color:red;background-color:hsl(0,0%,62.50%);">colors</span>.</p>
+</div>

+ 209 - 0
packages/ckeditor5-font/docs/_snippets/features/custom-font-color-and-background-color-options.js

@@ -0,0 +1,209 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import { CS_CONFIG } from '@ckeditor/ckeditor5-cloud-services/tests/_utils/cloud-services-config';
+
+/* globals ClassicEditor, console, window, document */
+ClassicEditor
+	.create( document.querySelector( '#snippet-custom-font-color-and-background-color-options' ), {
+		cloudServices: CS_CONFIG,
+		toolbar: {
+			items: [
+				'heading', '|', 'fontColor', 'fontBackgroundColor', 'bulletedList', 'numberedList', 'undo', 'redo'
+			],
+			viewportTopOffset: window.getViewportTopOffsetConfig()
+		},
+		fontBackgroundColor: {
+			colors: [
+				'hsl(0,0%,0%)',
+				'hsl(0,0%,12.5%)',
+				'hsl(0,0%,25%)',
+				'hsl(0,0%,37.5%)',
+				'hsl(0,0%,50%)',
+				'hsl(0,0%,62.50%)',
+				'hsl(0,0%,75%)',
+				'hsl(0,0%,87.5%)',
+				{
+					color: 'hsl(0,0%,100%)',
+					hasBorder: true
+				},
+				'hsl(0,100%,10%)',
+				'hsl(0,100%,20%)',
+				'hsl(0,100%,30%)',
+				'hsl(0,100%,40%)',
+				'hsl(0,100%,50%)',
+				'hsl(0,100%,60%)',
+				'hsl(0,100%,70%)',
+				'hsl(0,100%,80%)',
+				{
+					color: 'hsl(0,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(30,100%,10%)',
+				'hsl(30,100%,20%)',
+				'hsl(30,100%,30%)',
+				'hsl(30,100%,40%)',
+				'hsl(30,100%,50%)',
+				'hsl(30,100%,60%)',
+				'hsl(30,100%,70%)',
+				'hsl(30,100%,80%)',
+				{
+					color: 'hsl(30,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(60,100%,10%)',
+				'hsl(60,100%,20%)',
+				'hsl(60,100%,30%)',
+				'hsl(60,100%,40%)',
+				'hsl(60,100%,50%)',
+				'hsl(60,100%,60%)',
+				'hsl(60,100%,70%)',
+				'hsl(60,100%,80%)',
+				{
+					color: 'hsl(60,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(90,100%,10%)',
+				'hsl(90,100%,20%)',
+				'hsl(90,100%,30%)',
+				'hsl(90,100%,40%)',
+				'hsl(90,100%,50%)',
+				'hsl(90,100%,60%)',
+				'hsl(90,100%,70%)',
+				'hsl(90,100%,80%)',
+				{
+					color: 'hsl(90,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(120,100%,10%)',
+				'hsl(120,100%,20%)',
+				'hsl(120,100%,30%)',
+				'hsl(120,100%,40%)',
+				'hsl(120,100%,50%)',
+				'hsl(120,100%,60%)',
+				'hsl(120,100%,70%)',
+				'hsl(120,100%,80%)',
+				{
+					color: 'hsl(120,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(150,100%,10%)',
+				'hsl(150,100%,20%)',
+				'hsl(150,100%,30%)',
+				'hsl(150,100%,40%)',
+				'hsl(150,100%,50%)',
+				'hsl(150,100%,60%)',
+				'hsl(150,100%,70%)',
+				'hsl(150,100%,80%)',
+				{
+					color: 'hsl(150,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(180,100%,10%)',
+				'hsl(180,100%,20%)',
+				'hsl(180,100%,30%)',
+				'hsl(180,100%,40%)',
+				'hsl(180,100%,50%)',
+				'hsl(180,100%,60%)',
+				'hsl(180,100%,70%)',
+				'hsl(180,100%,80%)',
+				{
+					color: 'hsl(180,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(210,100%,10%)',
+				'hsl(210,100%,20%)',
+				'hsl(210,100%,30%)',
+				'hsl(210,100%,40%)',
+				'hsl(210,100%,50%)',
+				'hsl(210,100%,60%)',
+				'hsl(210,100%,70%)',
+				'hsl(210,100%,80%)',
+				{
+					color: 'hsl(210,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(240,100%,10%)',
+				'hsl(240,100%,20%)',
+				'hsl(240,100%,30%)',
+				'hsl(240,100%,40%)',
+				'hsl(240,100%,50%)',
+				'hsl(240,100%,60%)',
+				'hsl(240,100%,70%)',
+				'hsl(240,100%,80%)',
+				{
+					color: 'hsl(240,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(270,100%,10%)',
+				'hsl(270,100%,20%)',
+				'hsl(270,100%,30%)',
+				'hsl(270,100%,40%)',
+				'hsl(270,100%,50%)',
+				'hsl(270,100%,60%)',
+				'hsl(270,100%,70%)',
+				'hsl(270,100%,80%)',
+				{
+					color: 'hsl(270,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(300,100%,10%)',
+				'hsl(300,100%,20%)',
+				'hsl(300,100%,30%)',
+				'hsl(300,100%,40%)',
+				'hsl(300,100%,50%)',
+				'hsl(300,100%,60%)',
+				'hsl(300,100%,70%)',
+				'hsl(300,100%,80%)',
+				{
+					color: 'hsl(300,100%,90%)',
+					hasBorder: true
+				},
+				'hsl(330,100%,10%)',
+				'hsl(330,100%,20%)',
+				'hsl(330,100%,30%)',
+				'hsl(330,100%,40%)',
+				'hsl(330,100%,50%)',
+				'hsl(330,100%,60%)',
+				'hsl(330,100%,70%)',
+				'hsl(330,100%,80%)',
+				{
+					color: 'hsl(330,100%,90%)',
+					hasBorder: true
+				},
+			],
+			columns: 9
+		},
+		fontColor: {
+			colors: [
+				'black',
+				'gray',
+				'silver',
+				{
+					color: 'white',
+					hasBorder: true
+				},
+				'maroon',
+				'red',
+				'purple',
+				'fuchsia',
+				'green',
+				'lime',
+				'olive',
+				'yellow',
+				'navy',
+				'blue',
+				'teal',
+				'aqua'
+			],
+			columns: 4
+		}
+	} )
+	.then( editor => {
+		window.editor = editor;
+	} )
+	.catch( err => {
+		console.error( err.stack );
+	} );

+ 1 - 1
packages/ckeditor5-font/docs/_snippets/features/custom-font-family-options.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import { CS_CONFIG } from '@ckeditor/ckeditor5-cloud-services/tests/_utils/cloud-services-config';

+ 1 - 1
packages/ckeditor5-font/docs/_snippets/features/custom-font-size-named-options.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals ClassicEditor, console, window, document */

+ 1 - 1
packages/ckeditor5-font/docs/_snippets/features/custom-font-size-numeric-options.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals ClassicEditor, console, window, document */

+ 8 - 0
packages/ckeditor5-font/docs/_snippets/features/font.html

@@ -15,4 +15,12 @@
 		<span style="font-family: 'Courier New', Courier, monospace;">This text has the "Courier New, Courier, monospace" family set.</span>
 	</p>
 
+	<p>
+		<span style="color:hsl(90,75%,60%);background-color:hsl(240,75%,60%)">This text has light green color and blue background.</span>
+	</p>
+
+	<p>
+		<span style="color:hsl(0,0%,100%);background-color:hsl(0,0%,0%)">This text has white color and black background.</span>
+	</p>
+
 </div>

+ 12 - 2
packages/ckeditor5-font/docs/_snippets/features/font.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals ClassicEditor, console, window, document */
@@ -12,7 +12,17 @@ ClassicEditor
 		cloudServices: CS_CONFIG,
 		toolbar: {
 			items: [
-				'heading', '|', 'fontSize', 'fontFamily', '|', 'bulletedList', 'numberedList', 'undo', 'redo'
+				'heading',
+				'|',
+				'fontSize',
+				'fontFamily',
+				'fontColor',
+				'fontBackgroundColor',
+				'|',
+				'bulletedList',
+				'numberedList',
+				'undo',
+				'redo'
 			],
 			viewportTopOffset: window.getViewportTopOffsetConfig()
 		}

+ 5 - 2
packages/ckeditor5-font/docs/api/font.md

@@ -14,8 +14,11 @@ Check out the {@link features/font#demo demo in the Font feature} guide.
 
 ## Documentation
 
-See the {@link features/font Font feature} guide
-and {@link module:font/fontfamily~FontFamily} and {@link module:font/fontsize~FontSize} plugins documentation.
+See the {@link features/font Font feature} guide and plugins documentation:
+- {@link module:font/fontfamily~FontFamily}.
+- {@link module:font/fontsize~FontSize}.
+- {@link module:font/fontcolor~FontColor}.
+- {@link module:font/fontbackgroundcolor~FontBackgroundColor}.
 
 ## Installation
 

+ 142 - 1
packages/ckeditor5-font/docs/features/font.md

@@ -8,6 +8,8 @@ category: features
 The {@link module:font/font~Font} plugin enables the following features in the editor:
 * {@link module:font/fontfamily~FontFamily} &ndash; Allows to change the font family by applying inline `<span>` elements with a `font-family` in the `style` attribute.
 * {@link module:font/fontsize~FontSize} &ndash; Allows to control the font size by applying inline `<span>` elements that either have a CSS class or a `font-size` in the `style` attribute.
+* {@link module:font/fontcolor~FontColor} &ndash; Allows to control the font color by applying inline `<span>` elements with a `color` in the `style` attribute.
+* {@link module:font/fontbackgroundcolor~FontBackgroundColor} &ndash; Allows to control the font background color by applying inline `<span>` elements with a `background-color` in the `style` attribute.
 
 ## Demo
 
@@ -145,6 +147,111 @@ ClassicEditor
 
 {@snippet features/custom-font-size-numeric-options}
 
+## Configuring font color and font background color features
+
+Both font color and font background color features are configurable and share the same configuration format.
+
+<info-box info>
+	Please note that {@link module:font/fontcolor~FontColor font color} and {@link module:font/fontbackgroundcolor~FontBackgroundColor font background color} are separate plugins. They must be enabled and configured individually.
+</info-box>
+
+Check out the editor below with both features customized using the editor configuration:
+
+{@snippet features/custom-font-color-and-background-color-options}
+
+### Specifying the available colors
+
+It is possible to configure which colors are available in the color dropdown. Use the {@link module:font/fontcolor~FontColorConfig#colors `fontColor.colors`} and {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig#colors `fontBackgroundColor.colors`} configuration options to do so.
+
+```js
+ClassicEditor
+	.create( document.querySelector( '#editor' ), {
+		fontColor: {
+			colors: [
+				{
+					color: 'hsl(0, 0%, 0%)',
+					label: 'Black'
+				},
+				{
+					color: 'hsl(0, 0%, 30%)',
+					label: 'Dim grey'
+				},
+				{
+					color: 'hsl(0, 0%, 60%)',
+					label: 'Grey'
+				},
+				{
+					color: 'hsl(0, 0%, 90%)',
+					label: 'Light grey'
+				},
+				{
+					color: 'hsl(0, 0%, 100%)',
+					label: 'White',
+					hasBorder: true
+				},
+
+				// ...
+			]
+		},
+		fontBackgroundColor: {
+			colors: [
+				{
+					color: 'hsl(0, 75%, 60%)',
+					label: 'Red'
+				},
+				{
+					color: 'hsl(30, 75%, 60%)',
+					label: 'Orange'
+				},
+				{
+					color: 'hsl(60, 75%, 60%)',
+					label: 'Yellow'
+				},
+				{
+					color: 'hsl(90, 75%, 60%)',
+					label: 'Light green'
+				},
+				{
+					color: 'hsl(120, 75%, 60%)',
+					label: 'Green'
+				},
+
+				// ...
+			]
+		},
+		toolbar: [
+			'heading', 'bulletedList', 'numberedList', 'fontColor', 'fontBackgroundColor', 'undo', 'redo'
+		]
+	} )
+	.then( ... )
+	.catch( ... );
+```
+
+### Changing the geometry of the color grid
+
+It is also possible to configure in how many columns the colors in the grid are displayed. Use {@link module:font/fontcolor~FontColorConfig#columns `fontColor.columns`} and {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig#columns `fontBackgroundColor.columns`} to do so.
+
+```js
+ClassicEditor
+	.create( document.querySelector( '#editor' ), {
+		fontColor: {
+			columns: 3,
+
+			// ...
+		},
+		fontBackgroundColor: {
+			columns: 6,
+
+			// ...
+		},
+		toolbar: [
+			'heading', 'bulletedList', 'numberedList', 'fontColor', 'fontBackgroundColor', 'undo', 'redo'
+		]
+	} )
+	.then( ... )
+	.catch( ... );
+```
+
 ## Installation
 
 To add this feature to your editor, install the [`@ckeditor/ckeditor5-font`](https://www.npmjs.com/package/@ckeditor/ckeditor5-font) package:
@@ -161,7 +268,7 @@ import Font from '@ckeditor/ckeditor5-font/src/font';
 ClassicEditor
 	.create( document.querySelector( '#editor' ), {
 		plugins: [ Font, ... ],
-		toolbar: [ 'fontSize', 'fontFamily', ... ]
+		toolbar: [ 'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor', ... ]
 	} )
 	.then( ... )
 	.catch( ... );
@@ -256,6 +363,40 @@ The {@link module:font/fontsize~FontSize} plugin registers the following compone
 	editor.execute( 'fontSize' );
 	```
 
+The {@link module:font/fontcolor~FontColor} plugin registers the following components:
+
+* The `'fontColor'` dropdown,
+* The {@link module:font/fontcolor/fontcolorcommand~FontColorCommand `'fontColor'`} command.
+
+	You can change the font color of the current selection by executing the command with a desired value:
+
+	```js
+	editor.execute( 'fontColor', { value: 'rgb(30, 188, 97)' } );
+	```
+
+	Passing an empty value will remove the font color from the selection:
+
+	```js
+	editor.execute( 'fontColor' );
+	```
+
+The {@link module:font/fontbackgroundcolor~FontBackgroundColor} plugin registers the following components:
+
+* The `'fontBackgroundColor'` dropdown,
+* The {@link module:font/fontbackgroundcolor/fontbackgroundcolorcommand~FontBackgroundColorCommand `'fontBackgroundColor'`} command.
+
+	You can change the font background color of the current selection by executing the command with a desired value:
+
+	```js
+	editor.execute( 'fontBackgroundColor', { value: 'rgb(30, 188, 97)' } );
+	```
+
+	Passing an empty value will remove the font background color from the selection:
+
+	```js
+	editor.execute( 'fontBackgroundColor' );
+	```
+
 <info-box>
 	We recommend using the official {@link framework/guides/development-tools#ckeditor-5-inspector CKEditor 5 inspector} for development and debugging. It will give you tons of useful information about the state of the editor such as internal data structures, selection, commands, and many more.
 </info-box>

+ 19 - 1
packages/ckeditor5-font/lang/contexts.json

@@ -5,5 +5,23 @@
 	"Big": "Dropdown option label for the 'big' font size preset.",
 	"Huge": "Dropdown option label for the 'huge' font size preset.",
 	"Font Family": "Tooltip for the font family dropdown.",
-	"Default": "Dropdown option label for the default font family."
+	"Default": "Dropdown option label for the default font family.",
+	"Font Color": "Label of a button that allows selecting a font color.",
+	"Font Background Color": "Label of a button that allows selecting a font background color.",
+	"Remove color": "Label or a button that removes the color from the text (font color and background).",
+	"Black": "Label of a button that applies a black text color (font color and background)",
+	"Dim grey": "Label of a button that applies a dim grey text color (font color and background)",
+	"Grey": "Label of a button that applies a grey text color (font color and background)",
+	"Light grey": "Label of a button that applies a light grey text color (font color and background)",
+	"White": "Label of a button that applies a white text color (font color and background)",
+	"Red": "Label of a button that applies a red text color (font color and background)",
+	"Orange": "Label of a button that applies a orange text color (font color and background)",
+	"Yellow": "Label of a button that applies a yellow text color (font color and background)",
+	"Light green": "Label of a button that applies a light green text color (font color and background)",
+	"Green": "Label of a button that applies a green text color (font color and background)",
+	"Aquamarine": "Label of a button that applies a aquamarine text color (font color and background)",
+	"Turquoise": "Label of a button that applies a turquoise text color (font color and background)",
+	"Light blue": "Label of a button that applies a light blue text color (font color and background)",
+	"Blue": "Label of a button that applies a blue text color (font color and background)",
+	"Purple": "Label of a button that applies a purple text color (font color and background)"
 }

+ 72 - 0
packages/ckeditor5-font/lang/translations/ar.po

@@ -43,3 +43,75 @@ msgstr "نوع الخط"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "افتراضي"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/az.po

@@ -43,3 +43,75 @@ msgstr "Şrift ailəsi"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Default"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/ca.po

@@ -43,3 +43,75 @@ msgstr "Font"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Predeterminada"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/cs.po

@@ -43,3 +43,75 @@ msgstr "Typ písma"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Výchozí"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/de.po

@@ -43,3 +43,75 @@ msgstr "Schriftart"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Standard"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/en-au.po

@@ -43,3 +43,75 @@ msgstr "Font Family"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Default"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/en.po

@@ -43,3 +43,75 @@ msgstr "Font Family"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Default"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr "Font Color"
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr "Font Background Color"
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr "Remove color"
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr "Black"
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr "Dim grey"
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr "Grey"
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr "Light grey"
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr "White"
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr "Red"
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr "Orange"
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr "Yellow"
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr "Light green"
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr "Green"
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr "Aquamarine"
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr "Turquoise"
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr "Light blue"
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr "Blue"
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr "Purple"

+ 72 - 0
packages/ckeditor5-font/lang/translations/es.po

@@ -43,3 +43,75 @@ msgstr "Familia de fuente"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Por defecto"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/et.po

@@ -43,3 +43,75 @@ msgstr "Kirjastiil"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Vaikeväärtus"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/fa.po

@@ -43,3 +43,75 @@ msgstr "خانواده فونت"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "پیش فرض"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/fr.po

@@ -43,3 +43,75 @@ msgstr "Police"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Par défaut"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/gl.po

@@ -43,3 +43,75 @@ msgstr "Familia tipográfica"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Predeterminada"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/he.po

@@ -43,3 +43,75 @@ msgstr ""
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "ברירת מחדל"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/hr.po

@@ -43,3 +43,75 @@ msgstr "Obitelj fonta"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Podrazumijevano"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/hu.po

@@ -43,3 +43,75 @@ msgstr "Betűtípus"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Alapértelmezett"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/id.po

@@ -43,3 +43,75 @@ msgstr "Jenis Huruf"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Bawaan"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/it.po

@@ -43,3 +43,75 @@ msgstr "Tipo di caratteri"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Predefinito"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/ku.po

@@ -43,3 +43,75 @@ msgstr "فۆنتی خێزانی"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "بنچینە"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/nb.po

@@ -43,3 +43,75 @@ msgstr "Skrifttype"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Standard"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/ne.po

@@ -43,3 +43,75 @@ msgstr "फन्ट परिवार"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "पूर्वनिर्धारित"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/nl.po

@@ -43,3 +43,75 @@ msgstr "Lettertype"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Standaard"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/no.po

@@ -43,3 +43,75 @@ msgstr "Skrifttypefamilie"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Standard"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/pl.po

@@ -43,3 +43,75 @@ msgstr "Czcionka"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Domyślny"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/pt-br.po

@@ -43,3 +43,75 @@ msgstr "Fonte"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Padrão"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/pt.po

@@ -43,3 +43,75 @@ msgstr ""
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Padrão"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/ru.po

@@ -43,3 +43,75 @@ msgstr "Семейство шрифтов"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "По умолчанию"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/sk.po

@@ -43,3 +43,75 @@ msgstr "Názov písma"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Predvolené"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/sq.po

@@ -43,3 +43,75 @@ msgstr "Familja e fontit"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Parazgjedhur"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 78 - 6
packages/ckeditor5-font/lang/translations/sr-latn.po

@@ -12,7 +12,7 @@
 #
 msgid ""
 msgstr ""
-"Language-Team: Serbian (Latin) (https://www.transifex.com/ckeditor/teams/11143/sr%40latin/)\n"
+"Language-Team: Serbian (Latin) (https://www.transifex.com/ckeditor/teams/11143/sr@latin/)\n"
 "Language: sr@latin\n"
 "Plural-Forms: nplurals=3; plural=(n%10==1 && n%100!=11 ? 0 : n%10>=2 && n%10<=4 && (n%100<10 || n%100>=20) ? 1 : 2);\n"
 
@@ -22,24 +22,96 @@ msgstr "Veličina fonta"
 
 msgctxt "Dropdown option label for the 'tiny' font size preset."
 msgid "Tiny"
-msgstr ""
+msgstr "Sitno"
 
 msgctxt "Dropdown option label for the 'small' font size preset."
 msgid "Small"
-msgstr ""
+msgstr "Malo"
 
 msgctxt "Dropdown option label for the 'big' font size preset."
 msgid "Big"
-msgstr ""
+msgstr "Veliko"
 
 msgctxt "Dropdown option label for the 'huge' font size preset."
 msgid "Huge"
-msgstr ""
+msgstr "Ogromno"
 
 msgctxt "Tooltip for the font family dropdown."
 msgid "Font Family"
-msgstr ""
+msgstr "Font"
 
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Оsnovni"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 77 - 5
packages/ckeditor5-font/lang/translations/sr.po

@@ -22,24 +22,96 @@ msgstr "Величина фонта"
 
 msgctxt "Dropdown option label for the 'tiny' font size preset."
 msgid "Tiny"
-msgstr ""
+msgstr "Ситно"
 
 msgctxt "Dropdown option label for the 'small' font size preset."
 msgid "Small"
-msgstr ""
+msgstr "Мало"
 
 msgctxt "Dropdown option label for the 'big' font size preset."
 msgid "Big"
-msgstr ""
+msgstr "Велико"
 
 msgctxt "Dropdown option label for the 'huge' font size preset."
 msgid "Huge"
-msgstr ""
+msgstr "Огромно"
 
 msgctxt "Tooltip for the font family dropdown."
 msgid "Font Family"
-msgstr ""
+msgstr "Фонт"
 
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Основни"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/sv.po

@@ -43,3 +43,75 @@ msgstr "Typsnitt"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Standard"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/tr.po

@@ -43,3 +43,75 @@ msgstr "Yazı Tipi Ailesi"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "Varsayılan"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/uk.po

@@ -43,3 +43,75 @@ msgstr "Сімейство шрифтів"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "За замовчуванням"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 72 - 0
packages/ckeditor5-font/lang/translations/zh-cn.po

@@ -43,3 +43,75 @@ msgstr "字体"
 msgctxt "Dropdown option label for the default font family."
 msgid "Default"
 msgstr "默认"
+
+msgctxt "Label of a button that allows selecting a font color."
+msgid "Font Color"
+msgstr ""
+
+msgctxt "Label of a button that allows selecting a font background color."
+msgid "Font Background Color"
+msgstr ""
+
+msgctxt "Label or a button that removes the color from the text (font color and background)."
+msgid "Remove color"
+msgstr ""
+
+msgctxt "Label of a button that applies a black text color (font color and background)"
+msgid "Black"
+msgstr ""
+
+msgctxt "Label of a button that applies a dim grey text color (font color and background)"
+msgid "Dim grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a grey text color (font color and background)"
+msgid "Grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a light grey text color (font color and background)"
+msgid "Light grey"
+msgstr ""
+
+msgctxt "Label of a button that applies a white text color (font color and background)"
+msgid "White"
+msgstr ""
+
+msgctxt "Label of a button that applies a red text color (font color and background)"
+msgid "Red"
+msgstr ""
+
+msgctxt "Label of a button that applies a orange text color (font color and background)"
+msgid "Orange"
+msgstr ""
+
+msgctxt "Label of a button that applies a yellow text color (font color and background)"
+msgid "Yellow"
+msgstr ""
+
+msgctxt "Label of a button that applies a light green text color (font color and background)"
+msgid "Light green"
+msgstr ""
+
+msgctxt "Label of a button that applies a green text color (font color and background)"
+msgid "Green"
+msgstr ""
+
+msgctxt "Label of a button that applies a aquamarine text color (font color and background)"
+msgid "Aquamarine"
+msgstr ""
+
+msgctxt "Label of a button that applies a turquoise text color (font color and background)"
+msgid "Turquoise"
+msgstr ""
+
+msgctxt "Label of a button that applies a light blue text color (font color and background)"
+msgid "Light blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a blue text color (font color and background)"
+msgid "Blue"
+msgstr ""
+
+msgctxt "Label of a button that applies a purple text color (font color and background)"
+msgid "Purple"
+msgstr ""

+ 8 - 8
packages/ckeditor5-font/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-font",
-  "version": "11.0.0",
+  "version": "11.1.0",
   "description": "Font feature for CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -10,15 +10,15 @@
     "ckeditor5-plugin"
   ],
   "dependencies": {
-    "@ckeditor/ckeditor5-core": "^12.0.0",
-    "@ckeditor/ckeditor5-ui": "^12.0.0",
-    "@ckeditor/ckeditor5-utils": "^12.0.0"
+    "@ckeditor/ckeditor5-core": "^12.1.0",
+    "@ckeditor/ckeditor5-ui": "^12.1.0",
+    "@ckeditor/ckeditor5-utils": "^12.1.0"
   },
   "devDependencies": {
-    "@ckeditor/ckeditor5-editor-classic": "^12.0.0",
-    "@ckeditor/ckeditor5-engine": "^13.0.0",
-    "@ckeditor/ckeditor5-highlight": "^11.0.0",
-    "@ckeditor/ckeditor5-paragraph": "^11.0.0",
+    "@ckeditor/ckeditor5-editor-classic": "^12.1.0",
+    "@ckeditor/ckeditor5-engine": "^13.1.0",
+    "@ckeditor/ckeditor5-highlight": "^11.0.1",
+    "@ckeditor/ckeditor5-paragraph": "^11.0.1",
     "eslint": "^5.5.0",
     "eslint-config-ckeditor5": "^1.0.11",
     "husky": "^1.3.1",

+ 6 - 2
packages/ckeditor5-font/src/font.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -11,12 +11,16 @@ import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 
 import FontFamily from './fontfamily';
 import FontSize from './fontsize';
+import FontColor from './fontcolor';
+import FontBackgroundColor from './fontbackgroundcolor';
 
 /**
  * A plugin that enables a set of text styling features:
  *
  * * {@link module:font/fontsize~FontSize},
  * * {@link module:font/fontfamily~FontFamily}.
+ * * {@link module:font/fontcolor~FontColor},
+ * * {@link module:font/fontbackgroundcolor~FontBackgroundColor}.
  *
  * For a detailed overview, check the {@glink features/font Font feature} documentation
  * and the {@glink api/font package page}.
@@ -28,7 +32,7 @@ export default class Font extends Plugin {
 	 * @inheritDoc
 	 */
 	static get requires() {
-		return [ FontFamily, FontSize ];
+		return [ FontFamily, FontSize, FontColor, FontBackgroundColor ];
 	}
 
 	/**

+ 142 - 0
packages/ckeditor5-font/src/fontbackgroundcolor.js

@@ -0,0 +1,142 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/fontbackgroundcolor
+ */
+
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import FontBackgroundColorEditing from './fontbackgroundcolor/fontbackgroundcolorediting';
+import FontBackgroundColorUI from './fontbackgroundcolor/fontbackgroundcolorui';
+
+/**
+ * The font background color plugin.
+ *
+ * For a detailed overview, check the {@glink features/font font feature} documentation
+ * and the {@glink api/font package page}.
+ *
+ * This is a "glue" plugin which loads
+ * the {@link module:font/fontbackgroundcolor/fontbackgroundcolorediting~FontBackgroundColorEditing} and
+ * {@link module:font/fontbackgroundcolor/fontbackgroundcolorui~FontBackgroundColorUI} features in the editor.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class FontBackgroundColor extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get requires() {
+		return [ FontBackgroundColorEditing, FontBackgroundColorUI ];
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'FontBackgroundColor';
+	}
+}
+
+/**
+ * The configuration of the font background color feature.
+ * This option is used by the {@link module:font/fontbackgroundcolor/fontbackgroundcolorediting~FontBackgroundColorEditing} feature.
+ *
+ *		ClassicEditor
+ *			.create( {
+ *				fontBackgroundColor: ... // Font background color feature configuration.
+ *			} )
+ *			.then( ... )
+ *			.catch( ... );
+ *
+ * See {@link module:core/editor/editorconfig~EditorConfig all editor options}.
+ *
+ * @interface module:font/fontbackgroundcolor~FontBackgroundColorConfig
+ */
+
+/**
+ * Available font background colors defined as an array of strings or objects.
+ *
+ * The default value registers the following colors:
+ *
+ *		const fontBackgroundColorConfig = {
+ *			colors: [
+ *				{
+ *					color: 'hsl(0, 0%, 0%)',
+ *					label: 'Black'
+ *				},
+ *				{
+ *					color: 'hsl(0, 0%, 30%)',
+ *					label: 'Dim grey'
+ *				},
+ *				{
+ *					color: 'hsl(0, 0%, 60%)',
+ *					label: 'Grey'
+ *				},
+ *				{
+ *					color: 'hsl(0, 0%, 90%)',
+ *					label: 'Light grey'
+ *				},
+ *				{
+ *					color: 'hsl(0, 0%, 100%)',
+ *					label: 'White',
+ *					hasBorder: true
+ *				},
+ *				{
+ *					color: 'hsl(0, 75%, 60%)',
+ *					label: 'Red'
+ *				},
+ *				{
+ *					color: 'hsl(30, 75%, 60%)',
+ *					label: 'Orange'
+ *				},
+ *				{
+ *					color: 'hsl(60, 75%, 60%)',
+ *					label: 'Yellow'
+ *				},
+ *				{
+ *					color: 'hsl(90, 75%, 60%)',
+ *					label: 'Light green'
+ *				},
+ *				{
+ *					color: 'hsl(120, 75%, 60%)',
+ *					label: 'Green'
+ *				},
+ *				{
+ *					color: 'hsl(150, 75%, 60%)',
+ *					label: 'Aquamarine'
+ *				},
+ *				{
+ *					color: 'hsl(180, 75%, 60%)',
+ *					label: 'Turquoise'
+ *				},
+ *				{
+ *					color: 'hsl(210, 75%, 60%)',
+ *					label: 'Light blue'
+ *				},
+ *				{
+ *					color: 'hsl(240, 75%, 60%)',
+ *					label: 'Blue'
+ *				},
+ *				{
+ *					color: 'hsl(270, 75%, 60%)',
+ *					label: 'Purple'
+ *				}
+ *			]
+ *		};
+ *
+ * *Note*: The colors are displayed in the `'fontBackgroundColor'` dropdown.
+ *
+ * @member {Array.<String|Object>} module:font/fontbackgroundcolor~FontBackgroundColorConfig#colors
+ */
+
+/**
+ * Represents the amount of columns in the dropdown. The default value is:
+ *
+ *		const fontBackgroundColorConfig = {
+ *			columns: 5
+ *		}
+ *
+ * @member {Number} module:font/fontbackgroundcolor~FontBackgroundColorConfig#columns
+ */

+ 31 - 0
packages/ckeditor5-font/src/fontbackgroundcolor/fontbackgroundcolorcommand.js

@@ -0,0 +1,31 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/fontbackgroundcolor/fontbackgroundcolorcommand
+ */
+
+import FontCommand from '../fontcommand';
+import { FONT_BACKGROUND_COLOR } from '../utils';
+
+/**
+ * The font background color command. It's used by the
+ * {@link module:font/fontbackgroundcolor/fontbackgroundcolorediting~FontBackgroundColorEditing}
+ * to apply the font background color.
+ *
+ *		editor.execute( 'fontBackgroundColor', { value: 'rgb(250, 20, 20)' } );
+ *
+ * **Note**: Executing the command with the `null` value removes the attribute from the model.
+ *
+ * @extends module:font/fontcommand~FontCommand
+ */
+export default class FontBackgroundColorCommand extends FontCommand {
+	/**
+	 * @inheritDoc
+	 */
+	constructor( editor ) {
+		super( editor, FONT_BACKGROUND_COLOR );
+	}
+}

+ 123 - 0
packages/ckeditor5-font/src/fontbackgroundcolor/fontbackgroundcolorediting.js

@@ -0,0 +1,123 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/fontbackgroundcolor/fontbackgroundcolorediting
+ */
+
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import FontBackgroundColorCommand from './fontbackgroundcolorcommand';
+import { FONT_BACKGROUND_COLOR, renderDowncastElement, renderUpcastAttribute } from '../utils';
+
+/**
+ * The font background color editing feature.
+ *
+ * It introduces the {@link module:font/fontbackgroundcolor/fontbackgroundcolorcommand~FontBackgroundColorCommand command} and
+ * the `fontBackgroundColor` attribute in the {@link module:engine/model/model~Model model} which renders
+ * in the {@link module:engine/view/view view} as a `<span>` element (`<span style="background-color: ...">`),
+ * depending on the {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig configuration}.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class FontBackgroundColorEditing extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	constructor( editor ) {
+		super( editor );
+
+		editor.config.define( FONT_BACKGROUND_COLOR, {
+			colors: [
+				{
+					color: 'hsl(0, 0%, 0%)',
+					label: 'Black'
+				},
+				{
+					color: 'hsl(0, 0%, 30%)',
+					label: 'Dim grey'
+				},
+				{
+					color: 'hsl(0, 0%, 60%)',
+					label: 'Grey'
+				},
+				{
+					color: 'hsl(0, 0%, 90%)',
+					label: 'Light grey'
+				},
+				{
+					color: 'hsl(0, 0%, 100%)',
+					label: 'White',
+					hasBorder: true
+				},
+				{
+					color: 'hsl(0, 75%, 60%)',
+					label: 'Red'
+				},
+				{
+					color: 'hsl(30, 75%, 60%)',
+					label: 'Orange'
+				},
+				{
+					color: 'hsl(60, 75%, 60%)',
+					label: 'Yellow'
+				},
+				{
+					color: 'hsl(90, 75%, 60%)',
+					label: 'Light green'
+				},
+				{
+					color: 'hsl(120, 75%, 60%)',
+					label: 'Green'
+				},
+				{
+					color: 'hsl(150, 75%, 60%)',
+					label: 'Aquamarine'
+				},
+				{
+					color: 'hsl(180, 75%, 60%)',
+					label: 'Turquoise'
+				},
+				{
+					color: 'hsl(210, 75%, 60%)',
+					label: 'Light blue'
+				},
+				{
+					color: 'hsl(240, 75%, 60%)',
+					label: 'Blue'
+				},
+				{
+					color: 'hsl(270, 75%, 60%)',
+					label: 'Purple'
+				}
+			],
+			columns: 5
+		} );
+
+		editor.conversion.for( 'upcast' ).elementToAttribute( {
+			view: {
+				name: 'span',
+				styles: {
+					'background-color': /[\s\S]+/
+				}
+			},
+			model: {
+				key: FONT_BACKGROUND_COLOR,
+				value: renderUpcastAttribute( 'background-color' )
+			}
+		} );
+
+		editor.conversion.for( 'downcast' ).attributeToElement( {
+			model: FONT_BACKGROUND_COLOR,
+			view: renderDowncastElement( 'background-color' )
+		} );
+
+		editor.commands.add( FONT_BACKGROUND_COLOR, new FontBackgroundColorCommand( editor ) );
+
+		// Allow fontBackgroundColor attribute on text nodes.
+		editor.model.schema.extend( '$text', { allowAttributes: FONT_BACKGROUND_COLOR } );
+
+		editor.model.schema.setAttributeProperties( FONT_BACKGROUND_COLOR, { isFormatting: true } );
+	}
+}

+ 40 - 0
packages/ckeditor5-font/src/fontbackgroundcolor/fontbackgroundcolorui.js

@@ -0,0 +1,40 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/fontbackgroundcolor/fontbackgroundcolorui
+ */
+
+import ColorUI from '../ui/colorui';
+import { FONT_BACKGROUND_COLOR } from '../utils';
+import fontBackgroundColorIcon from '../../theme/icons/font-background.svg';
+
+/**
+ * The font background color UI plugin. It introduces the `'fontBackgroundColor'` dropdown.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class FontBackgroundColorUI extends ColorUI {
+	/**
+	 * @inheritDoc
+	 */
+	constructor( editor ) {
+		const t = editor.locale.t;
+
+		super( editor, {
+			commandName: FONT_BACKGROUND_COLOR,
+			componentName: FONT_BACKGROUND_COLOR,
+			icon: fontBackgroundColorIcon,
+			dropdownLabel: t( 'Font Background Color' )
+		} );
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'FontBackgroundColorUI';
+	}
+}

+ 141 - 0
packages/ckeditor5-font/src/fontcolor.js

@@ -0,0 +1,141 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/fontcolor
+ */
+
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import FontColorEditing from './fontcolor/fontcolorediting';
+import FontColorUI from './fontcolor/fontcolorui';
+
+/**
+ * The font color plugin.
+ *
+ * For a detailed overview, check the {@glink features/font font feature} documentation
+ * and the {@glink api/font package page}.
+ *
+ * This is a "glue" plugin which loads the {@link module:font/fontcolor/fontcolorediting~FontColorEditing} and
+ * {@link module:font/fontcolor/fontcolorui~FontColorUI} features in the editor.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class FontColor extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get requires() {
+		return [ FontColorEditing, FontColorUI ];
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'FontColor';
+	}
+}
+
+/**
+ * The configuration of the font color feature.
+ * This option is used by the {@link module:font/fontcolor/fontcolorediting~FontColorEditing} feature.
+ *
+ *		ClassicEditor
+ *			.create( {
+ *				fontColor: ... // Font color feature configuration.
+ *			} )
+ *			.then( ... )
+ *			.catch( ... );
+ *
+ * See {@link module:core/editor/editorconfig~EditorConfig all editor options}.
+ *
+ * @interface module:font/fontcolor~FontColorConfig
+ */
+
+/**
+ * Available font colors defined as an array of strings or objects.
+ *
+ * The default value registers the following colors:
+ *
+ *		const fontColorConfig = {
+ *			colors: [
+ *				{
+ *					color: 'hsl(0, 0%, 0%)',
+ *					label: 'Black'
+ *				},
+ *				{
+ *					color: 'hsl(0, 0%, 30%)',
+ *					label: 'Dim grey'
+ *				},
+ *				{
+ *					color: 'hsl(0, 0%, 60%)',
+ *					label: 'Grey'
+ *				},
+ *				{
+ *					color: 'hsl(0, 0%, 90%)',
+ *					label: 'Light grey'
+ *				},
+ *				{
+ *					color: 'hsl(0, 0%, 100%)',
+ *					label: 'White',
+ *					hasBorder: true
+ *				},
+ *				{
+ *					color: 'hsl(0, 75%, 60%)',
+ *					label: 'Red'
+ *				},
+ *				{
+ *					color: 'hsl(30, 75%, 60%)',
+ *					label: 'Orange'
+ *				},
+ *				{
+ *					color: 'hsl(60, 75%, 60%)',
+ *					label: 'Yellow'
+ *				},
+ *				{
+ *					color: 'hsl(90, 75%, 60%)',
+ *					label: 'Light green'
+ *				},
+ *				{
+ *					color: 'hsl(120, 75%, 60%)',
+ *					label: 'Green'
+ *				},
+ *				{
+ *					color: 'hsl(150, 75%, 60%)',
+ *					label: 'Aquamarine'
+ *				},
+ *				{
+ *					color: 'hsl(180, 75%, 60%)',
+ *					label: 'Turquoise'
+ *				},
+ *				{
+ *					color: 'hsl(210, 75%, 60%)',
+ *					label: 'Light blue'
+ *				},
+ *				{
+ *					color: 'hsl(240, 75%, 60%)',
+ *					label: 'Blue'
+ *				},
+ *				{
+ *					color: 'hsl(270, 75%, 60%)',
+ *					label: 'Purple'
+ *				}
+ *			]
+ *		};
+ *
+ * *Note*: The colors are displayed in the `'fontColor'` dropdown.
+ *
+ * @member {Array.<String|Object>} module:font/fontcolor~FontColorConfig#colors
+ */
+
+/**
+ * Represents the amount of columns in the dropdown. The default value is:
+ *
+ *		const fontColorConfig = {
+ *			columns: 5
+ *		}
+ *
+ * @member {Number} module:font/fontcolor~FontColorConfig#columns
+ */

+ 30 - 0
packages/ckeditor5-font/src/fontcolor/fontcolorcommand.js

@@ -0,0 +1,30 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/fontcolor/fontcolorcommand
+ */
+
+import FontCommand from '../fontcommand';
+import { FONT_COLOR } from '../utils';
+
+/**
+ * The font color command. It's used by the {@link module:font/fontcolor/fontcolorediting~FontColorEditing}
+ * to apply the font color.
+ *
+ *		editor.execute( 'fontColor', { value: 'rgb(250, 20, 20)' } );
+ *
+ * **Note**: Executing the command with the `null` value removes the attribute from the model.
+ *
+ * @extends module:font/fontcommand~FontCommand
+ */
+export default class FontColorCommand extends FontCommand {
+	/**
+	 * @inheritDoc
+	 */
+	constructor( editor ) {
+		super( editor, FONT_COLOR );
+	}
+}

+ 123 - 0
packages/ckeditor5-font/src/fontcolor/fontcolorediting.js

@@ -0,0 +1,123 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/fontcolor/fontcolorediting
+ */
+
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import FontColorCommand from './fontcolorcommand';
+import { FONT_COLOR, renderDowncastElement, renderUpcastAttribute } from '../utils';
+
+/**
+ * The font color editing feature.
+ *
+ * It introduces the {@link module:font/fontcolor/fontcolorcommand~FontColorCommand command} and
+ * the `fontColor` attribute in the {@link module:engine/model/model~Model model} which renders
+ * in the {@link module:engine/view/view view} as a `<span>` element (`<span style="color: ...">`),
+ * depending on the {@link module:font/fontcolor~FontColorConfig configuration}.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class FontColorEditing extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	constructor( editor ) {
+		super( editor );
+
+		editor.config.define( FONT_COLOR, {
+			colors: [
+				{
+					color: 'hsl(0, 0%, 0%)',
+					label: 'Black'
+				},
+				{
+					color: 'hsl(0, 0%, 30%)',
+					label: 'Dim grey'
+				},
+				{
+					color: 'hsl(0, 0%, 60%)',
+					label: 'Grey'
+				},
+				{
+					color: 'hsl(0, 0%, 90%)',
+					label: 'Light grey'
+				},
+				{
+					color: 'hsl(0, 0%, 100%)',
+					label: 'White',
+					hasBorder: true
+				},
+				{
+					color: 'hsl(0, 75%, 60%)',
+					label: 'Red'
+				},
+				{
+					color: 'hsl(30, 75%, 60%)',
+					label: 'Orange'
+				},
+				{
+					color: 'hsl(60, 75%, 60%)',
+					label: 'Yellow'
+				},
+				{
+					color: 'hsl(90, 75%, 60%)',
+					label: 'Light green'
+				},
+				{
+					color: 'hsl(120, 75%, 60%)',
+					label: 'Green'
+				},
+				{
+					color: 'hsl(150, 75%, 60%)',
+					label: 'Aquamarine'
+				},
+				{
+					color: 'hsl(180, 75%, 60%)',
+					label: 'Turquoise'
+				},
+				{
+					color: 'hsl(210, 75%, 60%)',
+					label: 'Light blue'
+				},
+				{
+					color: 'hsl(240, 75%, 60%)',
+					label: 'Blue'
+				},
+				{
+					color: 'hsl(270, 75%, 60%)',
+					label: 'Purple'
+				}
+			],
+			columns: 5
+		} );
+
+		editor.conversion.for( 'upcast' ).elementToAttribute( {
+			view: {
+				name: 'span',
+				styles: {
+					'color': /[\s\S]+/
+				}
+			},
+			model: {
+				key: FONT_COLOR,
+				value: renderUpcastAttribute( 'color' )
+			}
+		} );
+
+		editor.conversion.for( 'downcast' ).attributeToElement( {
+			model: FONT_COLOR,
+			view: renderDowncastElement( 'color' )
+		} );
+
+		editor.commands.add( FONT_COLOR, new FontColorCommand( editor ) );
+
+		// Allow fontColor attribute on text nodes.
+		editor.model.schema.extend( '$text', { allowAttributes: FONT_COLOR } );
+
+		editor.model.schema.setAttributeProperties( FONT_COLOR, { isFormatting: true } );
+	}
+}

+ 40 - 0
packages/ckeditor5-font/src/fontcolor/fontcolorui.js

@@ -0,0 +1,40 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/fontcolor/fontcolorui
+ */
+
+import ColorUI from '../ui/colorui';
+import { FONT_COLOR } from '../utils';
+import fontColorIcon from '../../theme/icons/font-color.svg';
+
+/**
+ * The font color UI plugin. It introduces the `'fontColor'` dropdown.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class FontColorUI extends ColorUI {
+	/**
+	 * @inheritDoc
+	 */
+	constructor( editor ) {
+		const t = editor.locale.t;
+
+		super( editor, {
+			commandName: FONT_COLOR,
+			componentName: FONT_COLOR,
+			icon: fontColorIcon,
+			dropdownLabel: t( 'Font Color' )
+		} );
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'FontColorUI';
+	}
+}

+ 1 - 1
packages/ckeditor5-font/src/fontcommand.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 1 - 1
packages/ckeditor5-font/src/fontfamily.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 3 - 2
packages/ckeditor5-font/src/fontfamily/fontfamilycommand.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -8,6 +8,7 @@
  */
 
 import FontCommand from '../fontcommand';
+import { FONT_FAMILY } from '../utils';
 
 /**
  * The font family command. It is used by {@link module:font/fontfamily/fontfamilyediting~FontFamilyEditing}
@@ -24,6 +25,6 @@ export default class FontFamilyCommand extends FontCommand {
 	 * @inheritDoc
 	 */
 	constructor( editor ) {
-		super( editor, 'fontFamily' );
+		super( editor, FONT_FAMILY );
 	}
 }

+ 3 - 4
packages/ckeditor5-font/src/fontfamily/fontfamilyediting.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -11,9 +11,7 @@ import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 
 import FontFamilyCommand from './fontfamilycommand';
 import { normalizeOptions } from './utils';
-import { buildDefinition } from '../utils';
-
-const FONT_FAMILY = 'fontFamily';
+import { buildDefinition, FONT_FAMILY } from '../utils';
 
 /**
  * The font family editing feature.
@@ -56,6 +54,7 @@ export default class FontFamilyEditing extends Plugin {
 
 		// Allow fontFamily attribute on text nodes.
 		editor.model.schema.extend( '$text', { allowAttributes: FONT_FAMILY } );
+		editor.model.schema.setAttributeProperties( FONT_FAMILY, { isFormatting: true } );
 
 		// Get configured font family options without "default" option.
 		const options = normalizeOptions( editor.config.get( 'fontFamily.options' ) ).filter( item => item.model );

+ 6 - 5
packages/ckeditor5-font/src/fontfamily/fontfamilyui.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -13,6 +13,7 @@ import Collection from '@ckeditor/ckeditor5-utils/src/collection';
 
 import { createDropdown, addListToDropdown } from '@ckeditor/ckeditor5-ui/src/dropdown/utils';
 import { normalizeOptions } from './utils';
+import { FONT_FAMILY } from '../utils';
 import fontFamilyIcon from '../../theme/icons/font-family.svg';
 
 /**
@@ -30,10 +31,10 @@ export default class FontFamilyUI extends Plugin {
 
 		const options = this._getLocalizedOptions();
 
-		const command = editor.commands.get( 'fontFamily' );
+		const command = editor.commands.get( FONT_FAMILY );
 
 		// Register UI component.
-		editor.ui.componentFactory.add( 'fontFamily', locale => {
+		editor.ui.componentFactory.add( FONT_FAMILY, locale => {
 			const dropdownView = createDropdown( locale );
 			addListToDropdown( dropdownView, _prepareListOptions( options, command ) );
 
@@ -76,7 +77,7 @@ export default class FontFamilyUI extends Plugin {
 		const editor = this.editor;
 		const t = editor.t;
 
-		const options = normalizeOptions( editor.config.get( 'fontFamily.options' ) );
+		const options = normalizeOptions( editor.config.get( FONT_FAMILY ).options );
 
 		return options.map( option => {
 			// The only title to localize is "Default" others are font names.
@@ -101,7 +102,7 @@ function _prepareListOptions( options, command ) {
 		const def = {
 			type: 'button',
 			model: new Model( {
-				commandName: 'fontFamily',
+				commandName: FONT_FAMILY,
 				commandParam: option.model,
 				label: option.title,
 				withText: true

+ 1 - 1
packages/ckeditor5-font/src/fontfamily/utils.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 1 - 1
packages/ckeditor5-font/src/fontsize.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 3 - 2
packages/ckeditor5-font/src/fontsize/fontsizecommand.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -8,6 +8,7 @@
  */
 
 import FontCommand from '../fontcommand';
+import { FONT_SIZE } from '../utils';
 
 /**
  * The font size command. It is used by {@link module:font/fontsize/fontsizeediting~FontSizeEditing}
@@ -24,6 +25,6 @@ export default class FontSizeCommand extends FontCommand {
 	 * @inheritDoc
 	 */
 	constructor( editor ) {
-		super( editor, 'fontSize' );
+		super( editor, FONT_SIZE );
 	}
 }

+ 3 - 4
packages/ckeditor5-font/src/fontsize/fontsizeediting.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -11,9 +11,7 @@ import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 
 import FontSizeCommand from './fontsizecommand';
 import { normalizeOptions } from './utils';
-import { buildDefinition } from '../utils';
-
-const FONT_SIZE = 'fontSize';
+import { buildDefinition, FONT_SIZE } from '../utils';
 
 /**
  * The font size editing feature.
@@ -65,5 +63,6 @@ export default class FontSizeEditing extends Plugin {
 
 		// Allow fontSize attribute on text nodes.
 		editor.model.schema.extend( '$text', { allowAttributes: FONT_SIZE } );
+		editor.model.schema.setAttributeProperties( FONT_SIZE, { isFormatting: true } );
 	}
 }

+ 7 - 6
packages/ckeditor5-font/src/fontsize/fontsizeui.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -12,7 +12,8 @@ import Model from '@ckeditor/ckeditor5-ui/src/model';
 import Collection from '@ckeditor/ckeditor5-utils/src/collection';
 
 import { createDropdown, addListToDropdown } from '@ckeditor/ckeditor5-ui/src/dropdown/utils';
-import { normalizeOptions } from '../fontsize/utils';
+import { normalizeOptions } from './utils';
+import { FONT_SIZE } from '../utils';
 
 import fontSizeIcon from '../../theme/icons/font-size.svg';
 import '../../theme/fontsize.css';
@@ -32,10 +33,10 @@ export default class FontSizeUI extends Plugin {
 
 		const options = this._getLocalizedOptions();
 
-		const command = editor.commands.get( 'fontSize' );
+		const command = editor.commands.get( FONT_SIZE );
 
 		// Register UI component.
-		editor.ui.componentFactory.add( 'fontSize', locale => {
+		editor.ui.componentFactory.add( FONT_SIZE, locale => {
 			const dropdownView = createDropdown( locale );
 			addListToDropdown( dropdownView, _prepareListOptions( options, command ) );
 
@@ -89,7 +90,7 @@ export default class FontSizeUI extends Plugin {
 			Huge: t( 'Huge' )
 		};
 
-		const options = normalizeOptions( editor.config.get( 'fontSize.options' ) );
+		const options = normalizeOptions( editor.config.get( FONT_SIZE ).options );
 
 		return options.map( option => {
 			const title = localizedTitles[ option.title ];
@@ -115,7 +116,7 @@ function _prepareListOptions( options, command ) {
 		const def = {
 			type: 'button',
 			model: new Model( {
-				commandName: 'fontSize',
+				commandName: FONT_SIZE,
 				commandParam: option.model,
 				label: option.title,
 				class: 'ck-fontsize-option',

+ 1 - 1
packages/ckeditor5-font/src/fontsize/utils.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 196 - 0
packages/ckeditor5-font/src/ui/colortableview.js

@@ -0,0 +1,196 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/ui/colortableview
+ */
+
+import View from '@ckeditor/ckeditor5-ui/src/view';
+import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
+import ColorGridView from '@ckeditor/ckeditor5-ui/src/colorgrid/colorgridview';
+import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
+import FocusCycler from '@ckeditor/ckeditor5-ui/src/focuscycler';
+import KeystrokeHandler from '@ckeditor/ckeditor5-utils/src/keystrokehandler';
+import removeButtonIcon from '@ckeditor/ckeditor5-core/theme/icons/eraser.svg';
+import '../../theme/fontcolor.css';
+
+/**
+ * Class which represents a view with the following sub–components:
+ *
+ * * a remove color button,
+ * * a {@link module:ui/colorgrid/colorgrid~ColorGridView}.
+ *
+ * @extends module:ui/view~View
+ */
+export default class ColorTableView extends View {
+	/**
+	 * Creates a view to be inserted as child of {@link module:ui/dropdown/dropdownview~DropdownView}.
+	 *
+	 * @param {module:utils/locale~Locale} [locale] The localization services instance.
+	 * @param {Object} config Configuration object
+	 * @param {Array.<module:ui/colorgrid/colorgrid~ColorDefinition>} config.colors Array with definitions of colors to
+	 * be displayed in the table.
+	 * @param {Number} config.columns Number of columns in the color grid.
+	 * @param {String} config.removeButtonLabel A label of a button responsible for removing the color.
+	 */
+	constructor( locale, { colors, columns, removeButtonLabel } ) {
+		super( locale );
+
+		/**
+		 * Collection of the children of the table.
+		 *
+		 * @readonly
+		 * @member {module:ui/viewcollection~ViewCollection}
+		 */
+		this.items = this.createCollection();
+
+		/**
+		 * An array with objects representing colors to be displayed in the grid.
+		 *
+		 * @type {Arrray.<module:ui/colorgrid/colorgrid~ColorDefinition>}
+		 */
+		this.colorDefinitions = colors;
+
+		/**
+		 * Tracks information about DOM focus in the list.
+		 *
+		 * @readonly
+		 * @member {module:utils/focustracker~FocusTracker}
+		 */
+		this.focusTracker = new FocusTracker();
+
+		/**
+		 * Instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}.
+		 *
+		 * @readonly
+		 * @member {module:utils/keystrokehandler~KeystrokeHandler}
+		 */
+		this.keystrokes = new KeystrokeHandler();
+
+		/**
+		 * Keeps value of the command associated with the table for current selection.
+		 *
+		 * @type {String}
+		 */
+		this.set( 'selectedColor' );
+
+		/**
+		 * A label of the button responsible for removing color attributes.
+		 *
+		 * @type {String}
+		 */
+		this.removeButtonLabel = removeButtonLabel;
+
+		/**
+		 * The number of columns in color grid.
+		 *
+		 * @type {Number}
+		 */
+		this.columns = columns;
+
+		/**
+		 * Helps cycling over focusable {@link #items} in the list.
+		 *
+		 * @readonly
+		 * @protected
+		 * @member {module:ui/focuscycler~FocusCycler}
+		 */
+		this._focusCycler = new FocusCycler( {
+			focusables: this.items,
+			focusTracker: this.focusTracker,
+			keystrokeHandler: this.keystrokes,
+			actions: {
+				// Navigate list items backwards using the arrowup key.
+				focusPrevious: 'arrowup',
+
+				// Navigate list items forwards using the arrowdown key.
+				focusNext: 'arrowdown',
+			}
+		} );
+
+		this.setTemplate( {
+			tag: 'div',
+			attributes: {
+				class: [
+					'ck',
+					'ck-color-table'
+				]
+			},
+			children: this.items
+		} );
+
+		this.items.add( this.removeColorButton() );
+		this.items.add( this.createStaticColorTable() );
+	}
+
+	/**
+	 * Adds the remove color button as child for current view.
+	 *
+	 * @private
+	 */
+	removeColorButton() {
+		const buttonView = new ButtonView();
+
+		buttonView.set( {
+			withText: true,
+			icon: removeButtonIcon,
+			tooltip: true,
+			label: this.removeButtonLabel
+		} );
+
+		buttonView.class = 'ck-color-table__remove-color';
+		buttonView.on( 'execute', () => {
+			this.fire( 'execute', { value: null } );
+		} );
+
+		return buttonView;
+	}
+
+	/**
+	 * Creates a static color table grid based on editor config.
+	 *
+	 * @private
+	 */
+	createStaticColorTable() {
+		const colorGrid = new ColorGridView( this.locale, {
+			colorDefinitions: this.colorDefinitions,
+			columns: this.columns
+		} );
+
+		colorGrid.delegate( 'execute' ).to( this );
+		colorGrid.bind( 'selectedColor' ).to( this );
+
+		return colorGrid;
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	render() {
+		super.render();
+
+		// Items added before rendering should be known to the #focusTracker.
+		for ( const item of this.items ) {
+			this.focusTracker.add( item.element );
+		}
+
+		// Start listening for the keystrokes coming from #element.
+		this.keystrokes.listenTo( this.element );
+	}
+
+	/**
+	 * Focuses the first focusable in {@link #items}.
+	 */
+	focus() {
+		this._focusCycler.focusFirst();
+	}
+
+	/**
+	 * Focuses the last focusable in {@link #items}.
+	 */
+	focusLast() {
+		this._focusCycler.focusLast();
+	}
+}

+ 123 - 0
packages/ckeditor5-font/src/ui/colorui.js

@@ -0,0 +1,123 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module font/ui/colorui
+ */
+
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import { createDropdown } from '@ckeditor/ckeditor5-ui/src/dropdown/utils';
+import {
+	addColorTableToDropdown,
+	normalizeColorOptions,
+	getLocalizedColorOptions
+} from '../utils';
+
+/**
+ * The color UI plugin which isolates the common logic responsible for displaying dropdowns with color grids.
+ *
+ * It is used to create the `'fontBackgroundColor'` and the `'fontColor'` dropdowns, each hosting
+ * a {@link module:font/ui/colortableview~ColorTableView}.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class ColorUI extends Plugin {
+	/**
+	 * Creates a plugin which brings dropdown with a pre–configured {@link module:font/ui/colortableview~ColorTableView}
+	 *
+	 * @param {module:core/editor/editor~Editor} editor
+	 * @param {Object} config Configuration object
+	 * @param {String} config.commandName Name of command which will be executed when a color tile is clicked.
+	 * @param {String} config.componentName Name of the dropdown in the {@link module:ui/componentfactory~ComponentFactory}
+	 * and the configuration scope name in `editor.config`.
+	 * @param {String} config.icon SVG icon used by the dropdown.
+	 * @param {String} config.dropdownLabel Label used by the dropdown.
+	 */
+	constructor( editor, { commandName, icon, componentName, dropdownLabel } ) {
+		super( editor );
+
+		/**
+		 * Name of the command which will be executed when a color tile is clicked.
+		 * @type {String}
+		 */
+		this.commandName = commandName;
+
+		/**
+		 * Name of this component in the {@link module:ui/componentfactory~ComponentFactory}.
+		 * Also the configuration scope name in `editor.config`.
+		 * @type {String}
+		 */
+		this.componentName = componentName;
+
+		/**
+		 * SVG icon used by the dropdown.
+		 * @type {String}
+		 */
+		this.icon = icon;
+
+		/**
+		 * Label used by the dropdown.
+		 * @type {String}
+		 */
+		this.dropdownLabel = dropdownLabel;
+
+		/**
+		 * Number of columns in color grid.
+		 * @type {Number}
+		 */
+		this.columns = editor.config.get( `${ this.componentName }.columns` );
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+		const t = editor.t;
+		const command = editor.commands.get( this.commandName );
+		const colorsConfig = normalizeColorOptions( editor.config.get( this.componentName ).colors );
+		const localizedColors = getLocalizedColorOptions( editor, colorsConfig );
+
+		// Register UI component.
+		editor.ui.componentFactory.add( this.componentName, locale => {
+			const dropdownView = createDropdown( locale );
+			const colorTableView = addColorTableToDropdown( {
+				dropdownView,
+				colors: localizedColors.map( option => ( {
+					label: option.label,
+					color: option.model,
+					options: {
+						hasBorder: option.hasBorder
+					}
+				} ) ),
+				columns: this.columns,
+				removeButtonLabel: t( 'Remove color' )
+			} );
+
+			colorTableView.bind( 'selectedColor' ).to( command, 'value' );
+
+			dropdownView.buttonView.set( {
+				label: this.dropdownLabel,
+				icon: this.icon,
+				tooltip: true
+			} );
+
+			dropdownView.extendTemplate( {
+				attributes: {
+					class: 'ck-color-ui-dropdown'
+				}
+			} );
+
+			dropdownView.bind( 'isEnabled' ).to( command );
+
+			dropdownView.on( 'execute', ( evt, data ) => {
+				editor.execute( this.commandName, data );
+				editor.editing.view.focus();
+			} );
+
+			return dropdownView;
+		} );
+	}
+}

+ 173 - 1
packages/ckeditor5-font/src/utils.js

@@ -1,12 +1,34 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
  * @module font/utils
  */
 
+import ColorTableView from './ui/colortableview';
+
+/**
+ * Name of the font size plugin.
+ */
+export const FONT_SIZE = 'fontSize';
+
+/**
+ * Name of the font family plugin.
+ */
+export const FONT_FAMILY = 'fontFamily';
+
+/**
+ * Name of the font color plugin.
+ */
+export const FONT_COLOR = 'fontColor';
+
+/**
+ * Name of font font background color plugin.
+ */
+export const FONT_BACKGROUND_COLOR = 'fontBackgroundColor';
+
 /**
  * Builds a proper {@link module:engine/conversion/conversion~ConverterDefinition converter definition} out of input data.
  *
@@ -35,3 +57,153 @@ export function buildDefinition( modelAttributeKey, options ) {
 
 	return definition;
 }
+
+/**
+ * A {@link module:font/fontcolor~FontColor font color} and
+ * {@link module:font/fontbackgroundcolor~FontBackgroundColor font background color} helper
+ * responsible for upcasting data to model.
+ *
+ * **Note**: `styleAttr` should be either `'color'` or `'background-color'`.
+ *
+ * @param {String} styleAttr
+ * @return {String}
+ */
+export function renderUpcastAttribute( styleAttr ) {
+	return viewElement => normalizeColorCode( viewElement.getStyle( styleAttr ) );
+}
+
+/**
+ * A {@link module:font/fontcolor~FontColor font color} and
+ * {@link module:font/fontbackgroundcolor~FontBackgroundColor font background color} helper
+ * responsible for downcasting a color attribute to a span element.
+ *
+ * **Note**: `styleAttr` should be either `'color'` or `'background-color'`.
+ *
+ * @param {String} styleAttr
+ */
+export function renderDowncastElement( styleAttr ) {
+	return ( modelAttributeValue, viewWriter ) => viewWriter.createAttributeElement( 'span', {
+		style: `${ styleAttr }:${ modelAttributeValue }`
+	} );
+}
+
+/**
+ * Creates a unified color definition object from color configuration options.
+ * The object contains both the information necessary to render the UI and initialize a conversion.
+ *
+ * @param {module:ui/colorgrid/colorgrid~ColorDefinition} options
+ * @returns {Array.<module:ui/colorgrid/colorgrid~ColorDefinition>}
+ */
+export function normalizeColorOptions( options ) {
+	return options
+		.map( normalizeSingleColorDefinition )
+		.filter( option => !!option );
+}
+
+/**
+ * Helper which add {@link module:font/ui/colortableview~ColorTableView} to a dropdown with proper initial values.
+ *
+ * @param {Object} config Configuration object
+ * @param {module:ui/dropdown/dropdownview~DropdownView} config.dropdownView Dropdown view to which
+ * a {@link module:font/ui/colortableview~ColorTableView} will be added.
+ * @param {Array.<module:ui/colorgrid/colorgrid~ColorDefinition>} config.colors An array with definitions
+ * representing colors to be displayed in the color table.
+ * @param {String} config.removeButtonLabel A label of a button responsible for removing the color.
+ * @returns {module:font/ui/colortableview~ColorTableView} The new color table view.
+ */
+export function addColorTableToDropdown( { dropdownView, colors, columns, removeButtonLabel } ) {
+	const locale = dropdownView.locale;
+	const colorTableView = new ColorTableView( locale, { colors, columns, removeButtonLabel } );
+
+	dropdownView.colorTableView = colorTableView;
+	dropdownView.panelView.children.add( colorTableView );
+
+	colorTableView.delegate( 'execute' ).to( dropdownView, 'execute' );
+
+	return colorTableView;
+}
+
+/**
+ * Returns color configuration options as defined in the `editor.config.(fontColor|fontBackgroundColor).colors`
+ * but processed to account for editor localization, i.e. to display {@link module:font/fontcolor~FontColorConfig}
+ * or {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig} in the correct language.
+ *
+ * Note: The reason behind this method is that there is no way to use {@link module:utils/locale~Locale#t}
+ * when the user configuration is defined because the editor does not exist yet.
+ *
+ * @param {module:core/editor/editor~Editor} editor An editor instance.
+ * @param {Array.<module:ui/colorgrid/colorgrid~ColorDefinition>} options
+ * @returns {Array.<module:ui/colorgrid/colorgrid~ColorDefinition>}.
+ */
+export function getLocalizedColorOptions( editor, options ) {
+	const t = editor.t;
+	const localizedColorNames = {
+		Black: t( 'Black' ),
+		'Dim grey': t( 'Dim grey' ),
+		Grey: t( 'Grey' ),
+		'Light grey': t( 'Light grey' ),
+		White: t( 'White' ),
+		Red: t( 'Red' ),
+		Orange: t( 'Orange' ),
+		Yellow: t( 'Yellow' ),
+		'Light green': t( 'Light green' ),
+		Green: t( 'Green' ),
+		Aquamarine: t( 'Aquamarine' ),
+		Turquoise: t( 'Turquoise' ),
+		'Light blue': t( 'Light blue' ),
+		Blue: t( 'Blue' ),
+		Purple: t( 'Purple' )
+	};
+
+	return options.map( colorOption => {
+		const label = localizedColorNames[ colorOption.label ];
+
+		if ( label && label != colorOption.label ) {
+			colorOption.label = label;
+		}
+
+		return colorOption;
+	} );
+}
+
+// Fixes color value string
+//
+// @param {String} value
+// @returns {String}
+function normalizeColorCode( value ) {
+	return value.replace( /\s/g, '' );
+}
+
+// Creates normalized color definition from user defined configuration.
+//
+// @param {String|module:ui/colorgrid/colorgrid~ColorDefinition}
+// @returns {module:ui/colorgrid/colorgrid~ColorDefinition}
+function normalizeSingleColorDefinition( color ) {
+	if ( typeof color === 'string' ) {
+		return {
+			model: color.replace( / /g, '' ),
+			label: color,
+			hasBorder: false,
+			view: {
+				name: 'span',
+				styles: {
+					color
+				},
+				priority: 5
+			}
+		};
+	} else {
+		return {
+			model: color.color.replace( / /g, '' ),
+			label: color.label || color.color,
+			hasBorder: color.hasBorder === undefined ? false : color.hasBorder,
+			view: {
+				name: 'span',
+				styles: {
+					color: `${ color.color }`
+				},
+				priority: 5
+			}
+		};
+	}
+}

+ 5 - 3
packages/ckeditor5-font/tests/font.js

@@ -1,15 +1,17 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import Font from './../src/font';
 import FontFamily from './../src/fontfamily';
 import FontSize from './../src/fontsize';
+import FontColor from './../src/fontcolor';
+import FontBackgroundColor from './../src/fontbackgroundcolor';
 
 describe( 'Font', () => {
-	it( 'requires FontSize', () => {
-		expect( Font.requires ).to.deep.equal( [ FontFamily, FontSize ] );
+	it( 'requires FontFamily, FontSize, FontColor, FontBackgroundColor', () => {
+		expect( Font.requires ).to.deep.equal( [ FontFamily, FontSize, FontColor, FontBackgroundColor ] );
 	} );
 
 	it( 'defines plugin name', () => {

+ 18 - 0
packages/ckeditor5-font/tests/fontbackgroundcolor.js

@@ -0,0 +1,18 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import FontBackgroundColor from './../src/fontbackgroundcolor';
+import FontBackgroundColorEditing from './../src/fontbackgroundcolor/fontbackgroundcolorediting';
+import FontBackgroundColorUI from '../src/fontbackgroundcolor/fontbackgroundcolorui';
+
+describe( 'FontBackgroundColor', () => {
+	it( 'requires FontBackgroundColorEditing and FontBackgroundColorUI', () => {
+		expect( FontBackgroundColor.requires ).to.deep.equal( [ FontBackgroundColorEditing, FontBackgroundColorUI ] );
+	} );
+
+	it( 'defines plugin name', () => {
+		expect( FontBackgroundColor.pluginName ).to.equal( 'FontBackgroundColor' );
+	} );
+} );

+ 34 - 0
packages/ckeditor5-font/tests/fontbackgroundcolor/fontbackgroundcolorcommand.js

@@ -0,0 +1,34 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import FontBackgroundColorCommand from '../../src/fontbackgroundcolor/fontbackgroundcolorcommand';
+import FontCommand from '../../src/fontcommand';
+import ModelTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/modeltesteditor';
+
+describe( 'FontBackgroundColorCommand', () => {
+	let editor, command;
+
+	beforeEach( () => {
+		return ModelTestEditor.create()
+			.then( newEditor => {
+				editor = newEditor;
+
+				command = new FontBackgroundColorCommand( editor );
+			} );
+	} );
+
+	afterEach( () => {
+		editor.destroy();
+	} );
+
+	it( 'is a FontCommand', () => {
+		expect( FontBackgroundColorCommand.prototype ).to.be.instanceOf( FontCommand );
+		expect( command ).to.be.instanceOf( FontCommand );
+	} );
+
+	it( 'operates on fontBackgroundColor attribute', () => {
+		expect( command ).to.have.property( 'attributeKey', 'fontBackgroundColor' );
+	} );
+} );

+ 263 - 0
packages/ckeditor5-font/tests/fontbackgroundcolor/fontbackgroundcoloreditng.js

@@ -0,0 +1,263 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import FontBackgroundColorEditing from './../../src/fontbackgroundcolor/fontbackgroundcolorediting';
+import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
+import VirtualTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/virtualtesteditor';
+import {
+	getData as getModelData,
+	setData as setModelData
+} from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+
+describe( 'FontBackgroundColorEditing', () => {
+	let editor, doc;
+
+	beforeEach( () => VirtualTestEditor
+		.create( {
+			plugins: [ FontBackgroundColorEditing, Paragraph ]
+		} )
+		.then( newEditor => {
+			editor = newEditor;
+
+			doc = editor.document;
+		} )
+	);
+
+	afterEach( () => {
+		editor.destroy();
+	} );
+
+	it( 'should set proper schema rules', () => {
+		expect( editor.model.schema.checkAttribute( [ '$block', '$text' ], 'fontBackgroundColor' ) ).to.be.true;
+		expect( editor.model.schema.checkAttribute( [ '$clipboardHolder', '$text' ], 'fontBackgroundColor' ) ).to.be.true;
+
+		expect( editor.model.schema.checkAttribute( [ '$block' ], 'fontBackgroundColor' ) ).to.be.false;
+	} );
+
+	it( 'has the attribute marked with the isFormatting property', () => {
+		expect( editor.model.schema.getAttributeProperties( 'fontBackgroundColor' ) ).to.deep.equal( {
+			isFormatting: true
+		} );
+	} );
+
+	describe( 'config', () => {
+		describe( 'default value', () => {
+			it( 'should be set', () => {
+				expect( editor.config.get( 'fontBackgroundColor.colors' ) ).to.deep.equal( [
+					{
+						color: 'hsl(0, 0%, 0%)',
+						label: 'Black'
+					},
+					{
+						color: 'hsl(0, 0%, 30%)',
+						label: 'Dim grey'
+					},
+					{
+						color: 'hsl(0, 0%, 60%)',
+						label: 'Grey'
+					},
+					{
+						color: 'hsl(0, 0%, 90%)',
+						label: 'Light grey'
+					},
+					{
+						color: 'hsl(0, 0%, 100%)',
+						label: 'White',
+						hasBorder: true
+					},
+					{
+						color: 'hsl(0, 75%, 60%)',
+						label: 'Red'
+					},
+					{
+						color: 'hsl(30, 75%, 60%)',
+						label: 'Orange'
+					},
+					{
+						color: 'hsl(60, 75%, 60%)',
+						label: 'Yellow'
+					},
+					{
+						color: 'hsl(90, 75%, 60%)',
+						label: 'Light green'
+					},
+					{
+						color: 'hsl(120, 75%, 60%)',
+						label: 'Green'
+					},
+					{
+						color: 'hsl(150, 75%, 60%)',
+						label: 'Aquamarine'
+					},
+					{
+						color: 'hsl(180, 75%, 60%)',
+						label: 'Turquoise'
+					},
+					{
+						color: 'hsl(210, 75%, 60%)',
+						label: 'Light blue'
+					},
+					{
+						color: 'hsl(240, 75%, 60%)',
+						label: 'Blue'
+					},
+					{
+						color: 'hsl(270, 75%, 60%)',
+						label: 'Purple'
+					}
+				] );
+				expect( editor.config.get( 'fontBackgroundColor.columns' ) ).to.equal( 5 );
+			} );
+		} );
+	} );
+
+	describe( 'editing pipeline conversion', () => {
+		beforeEach( () => VirtualTestEditor
+			.create( {
+				plugins: [ FontBackgroundColorEditing, Paragraph ],
+				fontBackgroundColor: {
+					colors: [
+						{
+							label: 'Color1',
+							color: '#000'
+						},
+						{
+							label: 'Color2',
+							color: '#123456'
+						},
+						{
+							label: 'Color3',
+							color: 'rgb( 0, 10, 20 )'
+						},
+						'hsl( 200,100%,50%)',
+						{
+							label: 'Color5 - Light Green',
+							color: 'lightgreen'
+						}
+					]
+				}
+			} )
+			.then( newEditor => {
+				editor = newEditor;
+				doc = editor.model;
+			} )
+		);
+
+		describe( 'convert different color version', () => {
+			const tests = [
+				'#000',
+				'green',
+				'rgb( 0, 10, 20 )',
+				'rgba( 20, 30, 50, 0.4)',
+				'hsl( 10, 20%, 30%)',
+				'hsla( 300, 50%, 100%, .3)',
+				'rgb( 20%, 30%, 40% )',
+				'#345678'
+			];
+
+			tests.forEach( test => {
+				it( `should convert fontBackgroundColor attribute: "${ test }" to proper style value.`, () => {
+					setModelData( doc, `<paragraph>fo<$text fontBackgroundColor="${ test }">o b</$text>ar</paragraph>` );
+
+					expect( editor.getData() ).to.equal( `<p>fo<span style="background-color:${ test };">o b</span>ar</p>` );
+				} );
+			} );
+		} );
+	} );
+
+	describe( 'data pipeline conversions', () => {
+		beforeEach( () => {
+			return VirtualTestEditor
+				.create( {
+					plugins: [ FontBackgroundColorEditing, Paragraph ],
+					fontBackgroundColor: {
+						colors: [
+							{
+								label: 'Color1',
+								color: '#000'
+							},
+							{
+								label: 'Color2',
+								color: '#123456'
+							},
+							{
+								label: 'Color3',
+								color: 'rgb( 0, 10, 20 )'
+							},
+							'hsl( 200,100%,50%)',
+							{
+								label: 'Color5 - Light Green',
+								color: 'lightgreen'
+							}
+						]
+					}
+				} )
+				.then( newEditor => {
+					editor = newEditor;
+
+					doc = editor.model;
+				} );
+		} );
+
+		it( 'should convert from element with defined style when with other styles', () => {
+			const data = '<p>f<span style="font-size: 18px;background-color: rgb(10, 20, 30);">o</span>o</p>';
+
+			editor.setData( data );
+
+			expect( getModelData( doc ) ).to.equal( '<paragraph>[]f<$text fontBackgroundColor="rgb(10,20,30)">o</$text>o</paragraph>' );
+
+			expect( editor.getData() ).to.equal( '<p>f<span style="background-color:rgb(10,20,30);">o</span>o</p>' );
+		} );
+
+		describe( 'should convert from different color versions', () => {
+			const tests = [
+				'#000',
+				'green',
+				'rgb( 0, 10, 20 )',
+				'rgba( 20, 30, 50, 0.4)',
+				'hsl( 10, 20%, 30%)',
+				'hsla( 300, 50%, 100%, .3)',
+				'rgb( 20%, 30%, 40% )',
+				'#345678'
+			];
+
+			tests.forEach( test => {
+				it( `should convert fontBackgroundColor attribute: "${ test }" to proper style value.`, () => {
+					const data = `<p>f<span style="background-color: ${ test }">o</span>o</p>`;
+					editor.setData( data );
+
+					expect( getModelData( doc ) )
+						.to.equal( `<paragraph>[]f<$text fontBackgroundColor="${ test.replace( / /g, '' ) }">o</$text>o</paragraph>` );
+
+					expect( editor.getData() )
+						.to.equal( `<p>f<span style="background-color:${ test.replace( / /g, '' ) };">o</span>o</p>` );
+				} );
+			} );
+		} );
+
+		it( 'should convert from complex definition', () => {
+			editor.setData(
+				'<p>f<span style="background-color: lightgreen;">o</span>o</p>' +
+				'<p>f<span style="background-color: hsl( 200, 100%, 50% );">o</span>o</p>' +
+				'<p>b<span style="background-color: rgba(1,2,3,.4);">a</span>r</p>' +
+				'<p>b<span style="background-color:#fff;">a</span>z</p>'
+			);
+
+			expect( getModelData( doc ) ).to.equal(
+				'<paragraph>[]f<$text fontBackgroundColor="lightgreen">o</$text>o</paragraph>' +
+				'<paragraph>f<$text fontBackgroundColor="hsl(200,100%,50%)">o</$text>o</paragraph>' +
+				'<paragraph>b<$text fontBackgroundColor="rgba(1,2,3,.4)">a</$text>r</paragraph>' +
+				'<paragraph>b<$text fontBackgroundColor="#fff">a</$text>z</paragraph>'
+			);
+
+			expect( editor.getData() ).to.equal(
+				'<p>f<span style="background-color:lightgreen;">o</span>o</p>' +
+				'<p>f<span style="background-color:hsl(200,100%,50%);">o</span>o</p>' +
+				'<p>b<span style="background-color:rgba(1,2,3,.4);">a</span>r</p>' +
+				'<p>b<span style="background-color:#fff;">a</span>z</p>'
+			);
+		} );
+	} );
+} );

+ 49 - 0
packages/ckeditor5-font/tests/fontbackgroundcolor/fontbackgroundcolorui.js

@@ -0,0 +1,49 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/* global document */
+
+import FontBackgroundColorEditing from './../../src/fontbackgroundcolor/fontbackgroundcolorediting';
+import FontBackgroundColorUI from './../../src/fontbackgroundcolor/fontbackgroundcolorui';
+import ColorUI from './../../src/ui/colorui';
+import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
+import fontBackgroundColorIcon from '../../theme/icons/font-background.svg';
+
+describe( 'FontBckgroundColorUI', () => {
+	let element, editor;
+
+	beforeEach( () => {
+		element = document.createElement( 'div' );
+		document.body.appendChild( element );
+
+		return ClassicTestEditor
+			.create( element, {
+				plugins: [ FontBackgroundColorEditing, FontBackgroundColorUI ]
+			} )
+			.then( newEditor => {
+				editor = newEditor;
+			} );
+	} );
+
+	afterEach( () => {
+		element.remove();
+
+		return editor.destroy();
+	} );
+
+	it( 'is ColorUI', () => {
+		expect( FontBackgroundColorUI.prototype ).to.be.instanceOf( ColorUI );
+	} );
+
+	it( 'has properly set initial values', () => {
+		const fontBackgroundColorUIPlugin = editor.plugins.get( 'FontBackgroundColorUI' );
+
+		expect( fontBackgroundColorUIPlugin.commandName ).to.equal( 'fontBackgroundColor' );
+		expect( fontBackgroundColorUIPlugin.componentName ).to.equal( 'fontBackgroundColor' );
+		expect( fontBackgroundColorUIPlugin.icon ).to.equal( fontBackgroundColorIcon );
+		expect( fontBackgroundColorUIPlugin.dropdownLabel ).to.equal( 'Font Background Color' );
+		expect( fontBackgroundColorUIPlugin.columns ).to.equal( 5 );
+	} );
+} );

+ 18 - 0
packages/ckeditor5-font/tests/fontcolor.js

@@ -0,0 +1,18 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import FontColor from './../src/fontcolor';
+import FontColorEditing from './../src/fontcolor/fontcolorediting';
+import FontColorUI from '../src/fontcolor/fontcolorui';
+
+describe( 'FontColor', () => {
+	it( 'requires FontColorEditing and FontColorUI', () => {
+		expect( FontColor.requires ).to.deep.equal( [ FontColorEditing, FontColorUI ] );
+	} );
+
+	it( 'defines plugin name', () => {
+		expect( FontColor.pluginName ).to.equal( 'FontColor' );
+	} );
+} );

+ 34 - 0
packages/ckeditor5-font/tests/fontcolor/fontcolorcommand.js

@@ -0,0 +1,34 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import FontColorCommand from '../../src/fontcolor/fontcolorcommand';
+import FontCommand from '../../src/fontcommand';
+import ModelTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/modeltesteditor';
+
+describe( 'FontColorCommand', () => {
+	let editor, command;
+
+	beforeEach( () => {
+		return ModelTestEditor.create()
+			.then( newEditor => {
+				editor = newEditor;
+
+				command = new FontColorCommand( editor );
+			} );
+	} );
+
+	afterEach( () => {
+		editor.destroy();
+	} );
+
+	it( 'is a FontCommand', () => {
+		expect( FontColorCommand.prototype ).to.be.instanceOf( FontCommand );
+		expect( command ).to.be.instanceOf( FontCommand );
+	} );
+
+	it( 'operates on fontColor attribute', () => {
+		expect( command ).to.have.property( 'attributeKey', 'fontColor' );
+	} );
+} );

+ 259 - 0
packages/ckeditor5-font/tests/fontcolor/fontcolorediting.js

@@ -0,0 +1,259 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import FontColorEditing from './../../src/fontcolor/fontcolorediting';
+import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
+import VirtualTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/virtualtesteditor';
+import {
+	getData as getModelData,
+	setData as setModelData
+} from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+
+describe( 'FontColorEditing', () => {
+	let editor, doc;
+
+	beforeEach( () => VirtualTestEditor
+		.create( {
+			plugins: [ FontColorEditing, Paragraph ]
+		} )
+		.then( newEditor => {
+			editor = newEditor;
+
+			doc = editor.document;
+		} )
+	);
+
+	afterEach( () => {
+		editor.destroy();
+	} );
+
+	it( 'should set proper schema rules', () => {
+		expect( editor.model.schema.checkAttribute( [ '$block', '$text' ], 'fontColor' ) ).to.be.true;
+		expect( editor.model.schema.checkAttribute( [ '$clipboardHolder', '$text' ], 'fontColor' ) ).to.be.true;
+		expect( editor.model.schema.checkAttribute( [ '$block' ], 'fontColor' ) ).to.be.false;
+	} );
+
+	it( 'has the attribute marked with the isFormatting property', () => {
+		expect( editor.model.schema.getAttributeProperties( 'fontColor' ) ).to.deep.equal( {
+			isFormatting: true
+		} );
+	} );
+
+	describe( 'config', () => {
+		describe( 'default value', () => {
+			it( 'should be set', () => {
+				expect( editor.config.get( 'fontColor.colors' ) ).to.deep.equal( [
+					{
+						color: 'hsl(0, 0%, 0%)',
+						label: 'Black'
+					},
+					{
+						color: 'hsl(0, 0%, 30%)',
+						label: 'Dim grey'
+					},
+					{
+						color: 'hsl(0, 0%, 60%)',
+						label: 'Grey'
+					},
+					{
+						color: 'hsl(0, 0%, 90%)',
+						label: 'Light grey'
+					},
+					{
+						color: 'hsl(0, 0%, 100%)',
+						label: 'White',
+						hasBorder: true
+					},
+					{
+						color: 'hsl(0, 75%, 60%)',
+						label: 'Red'
+					},
+					{
+						color: 'hsl(30, 75%, 60%)',
+						label: 'Orange'
+					},
+					{
+						color: 'hsl(60, 75%, 60%)',
+						label: 'Yellow'
+					},
+					{
+						color: 'hsl(90, 75%, 60%)',
+						label: 'Light green'
+					},
+					{
+						color: 'hsl(120, 75%, 60%)',
+						label: 'Green'
+					},
+					{
+						color: 'hsl(150, 75%, 60%)',
+						label: 'Aquamarine'
+					},
+					{
+						color: 'hsl(180, 75%, 60%)',
+						label: 'Turquoise'
+					},
+					{
+						color: 'hsl(210, 75%, 60%)',
+						label: 'Light blue'
+					},
+					{
+						color: 'hsl(240, 75%, 60%)',
+						label: 'Blue'
+					},
+					{
+						color: 'hsl(270, 75%, 60%)',
+						label: 'Purple'
+					}
+				] );
+				expect( editor.config.get( 'fontColor.columns' ) ).to.equal( 5 );
+			} );
+		} );
+	} );
+
+	describe( 'editing pipeline conversion', () => {
+		beforeEach( () => VirtualTestEditor
+			.create( {
+				plugins: [ FontColorEditing, Paragraph ],
+				fontColor: {
+					colors: [
+						{
+							label: 'Color1',
+							color: '#000'
+						},
+						{
+							label: 'Color2',
+							color: '#123456'
+						},
+						{
+							label: 'Color3',
+							color: 'rgb( 0, 10, 20 )'
+						},
+						'hsl( 200,100%,50%)',
+						{
+							label: 'Color5 - Light Green',
+							color: 'lightgreen'
+						}
+					]
+				}
+			} )
+			.then( newEditor => {
+				editor = newEditor;
+				doc = editor.model;
+			} )
+		);
+
+		describe( 'convert different color version', () => {
+			const tests = [
+				'#000',
+				'green',
+				'rgb( 0, 10, 20 )',
+				'rgba( 20, 30, 50, 0.4)',
+				'hsl( 10, 20%, 30%)',
+				'hsla( 300, 50%, 100%, .3)',
+				'rgb( 20%, 30%, 40% )',
+				'#345678'
+			];
+			tests.forEach( test => {
+				it( `should convert fontColor attribute: "${ test }" to proper style value.`, () => {
+					setModelData( doc, `<paragraph>fo<$text fontColor="${ test }">o b</$text>ar</paragraph>` );
+
+					expect( editor.getData() ).to.equal( `<p>fo<span style="color:${ test };">o b</span>ar</p>` );
+				} );
+			} );
+		} );
+	} );
+
+	describe( 'data pipeline conversions', () => {
+		beforeEach( () => {
+			return VirtualTestEditor
+				.create( {
+					plugins: [ FontColorEditing, Paragraph ],
+					fontColor: {
+						colors: [
+							{
+								label: 'Color1',
+								color: '#000'
+							},
+							{
+								label: 'Color2',
+								color: '#123456'
+							},
+							{
+								label: 'Color3',
+								color: 'rgb( 0, 10, 20 )'
+							},
+							'hsl( 200,100%,50%)',
+							{
+								label: 'Color5 - Light Green',
+								color: 'lightgreen'
+							}
+						]
+					}
+				} )
+				.then( newEditor => {
+					editor = newEditor;
+
+					doc = editor.model;
+				} );
+		} );
+
+		it( 'should convert from element with defined style when with other styles', () => {
+			const data = '<p>f<span style="font-size: 18px;color: rgb(10, 20, 30);">o</span>o</p>';
+
+			editor.setData( data );
+
+			expect( getModelData( doc ) ).to.equal( '<paragraph>[]f<$text fontColor="rgb(10,20,30)">o</$text>o</paragraph>' );
+			expect( editor.getData() ).to.equal( '<p>f<span style="color:rgb(10,20,30);">o</span>o</p>' );
+		} );
+
+		describe( 'should convert from different color versions', () => {
+			const tests = [
+				'#000',
+				'green',
+				'rgb( 0, 10, 20 )',
+				'rgba( 20, 30, 50, 0.4)',
+				'hsl( 10, 20%, 30%)',
+				'hsla( 300, 50%, 100%, .3)',
+				'rgb( 20%, 30%, 40% )',
+				'#345678'
+			];
+
+			tests.forEach( test => {
+				it( `should convert fontColor attribute: "${ test }" to proper style value.`, () => {
+					const data = `<p>f<span style="color: ${ test }">o</span>o</p>`;
+					editor.setData( data );
+
+					expect( getModelData( doc ) )
+						.to.equal( `<paragraph>[]f<$text fontColor="${ test.replace( / /g, '' ) }">o</$text>o</paragraph>` );
+
+					expect( editor.getData() ).to.equal( `<p>f<span style="color:${ test.replace( / /g, '' ) };">o</span>o</p>` );
+				} );
+			} );
+		} );
+
+		it( 'should convert from complex definition', () => {
+			editor.setData(
+				'<p>f<span style="color: lightgreen;">o</span>o</p>' +
+				'<p>f<span style="color: hsl( 200, 100%, 50% );">o</span>o</p>' +
+				'<p>b<span style="color: rgba(1,2,3,.4);">a</span>r</p>' +
+				'<p>b<span style="color:#fff;">a</span>z</p>'
+			);
+
+			expect( getModelData( doc ) ).to.equal(
+				'<paragraph>[]f<$text fontColor="lightgreen">o</$text>o</paragraph>' +
+				'<paragraph>f<$text fontColor="hsl(200,100%,50%)">o</$text>o</paragraph>' +
+				'<paragraph>b<$text fontColor="rgba(1,2,3,.4)">a</$text>r</paragraph>' +
+				'<paragraph>b<$text fontColor="#fff">a</$text>z</paragraph>'
+			);
+
+			expect( editor.getData() ).to.equal(
+				'<p>f<span style="color:lightgreen;">o</span>o</p>' +
+				'<p>f<span style="color:hsl(200,100%,50%);">o</span>o</p>' +
+				'<p>b<span style="color:rgba(1,2,3,.4);">a</span>r</p>' +
+				'<p>b<span style="color:#fff;">a</span>z</p>'
+			);
+		} );
+	} );
+} );

+ 49 - 0
packages/ckeditor5-font/tests/fontcolor/fontcolorui.js

@@ -0,0 +1,49 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/* global document */
+
+import FontColorEditing from './../../src/fontcolor/fontcolorediting';
+import FontColorUI from './../../src/fontcolor/fontcolorui';
+import ColorUI from './../../src/ui/colorui';
+import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
+import fontColorIcon from '../../theme/icons/font-color.svg';
+
+describe( 'FontColorUI', () => {
+	let element, editor;
+
+	beforeEach( () => {
+		element = document.createElement( 'div' );
+		document.body.appendChild( element );
+
+		return ClassicTestEditor
+			.create( element, {
+				plugins: [ FontColorEditing, FontColorUI ]
+			} )
+			.then( newEditor => {
+				editor = newEditor;
+			} );
+	} );
+
+	afterEach( () => {
+		element.remove();
+
+		return editor.destroy();
+	} );
+
+	it( 'is ColorUI', () => {
+		expect( FontColorUI.prototype ).to.be.instanceOf( ColorUI );
+	} );
+
+	it( 'has properly set initial values', () => {
+		const fontColorUIPlugin = editor.plugins.get( 'FontColorUI' );
+
+		expect( fontColorUIPlugin.commandName ).to.equal( 'fontColor' );
+		expect( fontColorUIPlugin.componentName ).to.equal( 'fontColor' );
+		expect( fontColorUIPlugin.icon ).to.equal( fontColorIcon );
+		expect( fontColorUIPlugin.dropdownLabel ).to.equal( 'Font Color' );
+		expect( fontColorUIPlugin.columns ).to.equal( 5 );
+	} );
+} );

+ 1 - 1
packages/ckeditor5-font/tests/fontcommand.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import FontCommand from '../src/fontcommand';

+ 1 - 1
packages/ckeditor5-font/tests/fontfamily.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import FontFamily from './../src/fontfamily';

+ 1 - 1
packages/ckeditor5-font/tests/fontfamily/fontfamilycommand.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import FontFamilyCommand from '../../src/fontfamily/fontfamilycommand';

+ 7 - 1
packages/ckeditor5-font/tests/fontfamily/fontfamilyediting.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import FontFamilyEditing from './../../src/fontfamily/fontfamilyediting';
@@ -36,6 +36,12 @@ describe( 'FontFamilyEditing', () => {
 		expect( editor.model.schema.checkAttribute( [ '$block' ], 'fontFamily' ) ).to.be.false;
 	} );
 
+	it( 'should be marked with a formatting property', () => {
+		expect( editor.model.schema.getAttributeProperties( 'fontFamily' ) ).to.deep.equal( {
+			isFormatting: true
+		} );
+	} );
+
 	describe( 'config', () => {
 		describe( 'default value', () => {
 			it( 'should be set', () => {

+ 1 - 1
packages/ckeditor5-font/tests/fontfamily/fontfamilyui.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* global document */

+ 1 - 1
packages/ckeditor5-font/tests/fontfamily/utils.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import { normalizeOptions } from '../../src/fontfamily/utils';

+ 1 - 1
packages/ckeditor5-font/tests/fontsize.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import FontSize from './../src/fontsize';

+ 1 - 1
packages/ckeditor5-font/tests/fontsize/fontsizecommand.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import FontSizeCommand from '../../src/fontsize/fontsizecommand';

+ 7 - 1
packages/ckeditor5-font/tests/fontsize/fontsizeediting.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import FontSizeEditing from './../../src/fontsize/fontsizeediting';
@@ -36,6 +36,12 @@ describe( 'FontSizeEditing', () => {
 		expect( editor.model.schema.checkAttribute( [ '$block' ], 'fontSize' ) ).to.be.false;
 	} );
 
+	it( 'should be marked with a formatting property', () => {
+		expect( editor.model.schema.getAttributeProperties( 'fontSize' ) ).to.deep.equal( {
+			isFormatting: true
+		} );
+	} );
+
 	describe( 'config', () => {
 		describe( 'default value', () => {
 			it( 'should be set', () => {

+ 1 - 1
packages/ckeditor5-font/tests/fontsize/fontsizeui.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* global document */

+ 1 - 1
packages/ckeditor5-font/tests/fontsize/integration.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* global document */

+ 1 - 1
packages/ckeditor5-font/tests/fontsize/utils.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 import { normalizeOptions } from '../../src/fontsize/utils';

+ 12 - 0
packages/ckeditor5-font/tests/manual/font-color.html

@@ -0,0 +1,12 @@
+<div id="editor">
+	<p><span>01. no-color; no-color</span></p>
+	<p><span style="color:hsl(0, 0%, 100%);background-color:hsl(0, 0%, 0%);">02. color:hsl(0, 0%, 100%);background-color:hsl(0, 0%, 0%);</span></p>
+	<p><span style="color:hsl(0, 75%, 60%);">03. color:hsl(0, 75%, 60%); no-color;</span></p>
+	<p><span style="background-color:hsl(90, 75%, 60%);">04. no-color; background-color:hsl(90, 75%, 60%);</span></p>
+	<p><span style="color:hsl(30, 75%, 60%);background-color:hsl(0, 0%, 30%);">05. color:hsl(30, 75%, 60%); background-color:hsl(0, 0%, 30%);</span></p>
+	<p><span style="color:#00FFFF;background-color:rgb(255, 0, 0);">06. color:#00FFFF;background-color:rgb(255, 0, 0);</span></p>
+	<p><span style="color:hsla( 0, 0%, 0%, .7);background-color:gold;">07. color:hsla( 0, 0%, 0%, .7); background-color:gold;</span></p>
+	<p><span style="color:rgba( 0, 120, 250, 0.8);background-color:hsla(270, 100%, 50%, 0.3);">08. color:;background-color:hsla(270, 100%, 50%, 0.3);</span></p>
+	<p><span style="color:#ddd;background-color:hsl(150, 75%, 60%);">09. color:#ddd;background-color:hsl(150, 75%, 60%);</span></p>
+	<p><span style="color:hsl(270, 75%, 60%);background-color:#d82;">10. color:hsl(270, 75%, 60%);background-color:#d82;</span></p>
+</div>

+ 40 - 0
packages/ckeditor5-font/tests/manual/font-color.js

@@ -0,0 +1,40 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/* globals console, window, document */
+
+import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
+import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
+import FontColor from '../../src/fontcolor';
+import FontBackgroundColor from '../../src/fontbackgroundcolor';
+
+ClassicEditor
+	.create( document.querySelector( '#editor' ), {
+		plugins: [
+			ArticlePluginSet,
+			FontColor,
+			FontBackgroundColor
+		],
+		toolbar: [
+			'heading',
+			'|',
+			'fontColor',
+			'fontBackgroundColor',
+			'bold',
+			'italic',
+			'link',
+			'bulletedList',
+			'numberedList',
+			'blockQuote',
+			'undo',
+			'redo'
+		]
+	} )
+	.then( editor => {
+		window.editor = editor;
+	} )
+	.catch( err => {
+		console.error( err.stack );
+	} );

+ 14 - 0
packages/ckeditor5-font/tests/manual/font-color.md

@@ -0,0 +1,14 @@
+### Loading
+
+The data should be loaded with different text and background colors in the following order:
+
+* Colors 1-5 use the predefined palette,
+* Colors 6-8 use custom CSS colors, not defined in the configuration,
+* Color 9-10 use a mix from the predefined palette and custom ones.
+
+The format in the editor content is: `N. [font color]; [background color]`.
+
+### Testing
+
+- Change the font color and font background color on selected text.
+- Change the font color and font background color across many paragraphs.

+ 1 - 1
packages/ckeditor5-font/tests/manual/font-family.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals console, window, document */

+ 1 - 1
packages/ckeditor5-font/tests/manual/font-size-numeric.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals console, window, document */

+ 1 - 1
packages/ckeditor5-font/tests/manual/font-size-presets.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals console, window, document */

Некоторые файлы не были показаны из-за большого количества измененных файлов