diff --git a/src/compiler/compile/compiler_errors.ts b/src/compiler/compile/compiler_errors.ts
index c9282189f14..df832373fcd 100644
--- a/src/compiler/compile/compiler_errors.ts
+++ b/src/compiler/compile/compiler_errors.ts
@@ -265,5 +265,9 @@ export default {
 	cyclical_const_tags: (cycle: string[]) => ({
 		code: 'cyclical-const-tags',
 		message: `Cyclical dependency detected: ${cycle.join(' → ')}`
-	})
+	}),
+	invalid_component_style_directive: {
+		code: 'invalid-component-style-directive',
+		message: 'Style directives cannot be used on components'
+	}
 };
diff --git a/src/compiler/compile/nodes/InlineComponent.ts b/src/compiler/compile/nodes/InlineComponent.ts
index e65bf445da7..13fb13c2785 100644
--- a/src/compiler/compile/nodes/InlineComponent.ts
+++ b/src/compiler/compile/nodes/InlineComponent.ts
@@ -71,7 +71,10 @@ export default class InlineComponent extends Node {
 
 				case 'Transition':
 					return component.error(node, compiler_errors.invalid_transition);
-
+				
+				case 'StyleDirective':
+					return component.error(node, compiler_errors.invalid_component_style_directive);
+	
 				default:
 					throw new Error(`Not implemented: ${node.type}`);
 			}
diff --git a/test/validator/samples/component-invalid-style-directive/errors.json b/test/validator/samples/component-invalid-style-directive/errors.json
new file mode 100644
index 00000000000..087f0db651b
--- /dev/null
+++ b/test/validator/samples/component-invalid-style-directive/errors.json
@@ -0,0 +1,9 @@
+[
+	{
+		"code": "invalid-component-style-directive",
+		"message": "Style directives cannot be used on components",
+		"start": { "line": 7, "column": 19, "character": 97 },
+		"end": { "line": 7, "column": 36, "character": 114 },
+		"pos": 97
+	}
+]
diff --git a/test/validator/samples/component-invalid-style-directive/input.svelte b/test/validator/samples/component-invalid-style-directive/input.svelte
new file mode 100644
index 00000000000..975621088fa
--- /dev/null
+++ b/test/validator/samples/component-invalid-style-directive/input.svelte
@@ -0,0 +1,7 @@
+<script>
+	let name = 'world';
+	
+	import Child from 'Child.svelte';
+</script>
+
+<Child name={name} style:color="red" />
\ No newline at end of file