diff --git a/CHANGES.md b/CHANGES.md
index 86dc83bf1f..f906cad1ec 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -40,6 +40,7 @@ Grammars:
 - enh(nsis) add new NSIS commands (#3351) [idleberg][]
 - fix(nsis) set `case_insensitive` to `true` (#3351) [idleberg][]
 - fix(css/less/stylus/scss) highlight single-colon psuedo-elements properly (#3240) [zsoltlengyelit][]
+- fix(css) add css hex color alpha support (#3360) [ierehon1905][]
 
 [Austin Schick]: https://github.com/austin-schick
 [Josh Goebel]: https://github.com/joshgoebel
@@ -53,6 +54,7 @@ Grammars:
 [zsoltlengyelit]: github.com/zsoltlengyelit
 [Syb Wartna]:https://github.com/waarissyb
 [idleberg]: https://github.com/idleberg
+[ierehon1905]: https://github.com/ierehon1905
 
 
 ## Version 11.2.0
diff --git a/src/languages/lib/css-shared.js b/src/languages/lib/css-shared.js
index 9c9d2a364a..933a484154 100644
--- a/src/languages/lib/css-shared.js
+++ b/src/languages/lib/css-shared.js
@@ -7,7 +7,7 @@ export const MODES = (hljs) => {
     BLOCK_COMMENT: hljs.C_BLOCK_COMMENT_MODE,
     HEXCOLOR: {
       scope: 'number',
-      begin: '#([a-fA-F0-9]{6}|[a-fA-F0-9]{3})'
+      begin: /#(([0-9a-fA-F]{3,4})|(([0-9a-fA-F]{2}){3,4}))\b/
     },
     FUNCTION_DISPATCH: {
       className: "built_in",
diff --git a/test/markup/css/hex-colors.expect.txt b/test/markup/css/hex-colors.expect.txt
new file mode 100644
index 0000000000..062d05876c
--- /dev/null
+++ b/test/markup/css/hex-colors.expect.txt
@@ -0,0 +1,19 @@
+<span class="hljs-selector-class">.test-short</span> {
+    <span class="hljs-attribute">color</span>: <span class="hljs-number">#abc</span>;
+}
+
+<span class="hljs-selector-class">.test-short-alpha</span> {
+    <span class="hljs-attribute">color</span>: <span class="hljs-number">#abcd</span>;
+}
+
+<span class="hljs-selector-class">.test-long</span> {
+    <span class="hljs-attribute">color</span>: <span class="hljs-number">#aabbcc</span>;
+}
+
+<span class="hljs-selector-class">.test-long-alpha</span> {
+    <span class="hljs-attribute">color</span>: <span class="hljs-number">#aabbccdd</span>;
+}
+
+<span class="hljs-selector-class">.test-invalid</span> {
+    <span class="hljs-attribute">color</span>: #aabbccd;
+}
\ No newline at end of file
diff --git a/test/markup/css/hex-colors.txt b/test/markup/css/hex-colors.txt
new file mode 100644
index 0000000000..f74a3cec52
--- /dev/null
+++ b/test/markup/css/hex-colors.txt
@@ -0,0 +1,19 @@
+.test-short {
+    color: #abc;
+}
+
+.test-short-alpha {
+    color: #abcd;
+}
+
+.test-long {
+    color: #aabbcc;
+}
+
+.test-long-alpha {
+    color: #aabbccdd;
+}
+
+.test-invalid {
+    color: #aabbccd;
+}
\ No newline at end of file