Adding css to the sadow dom of a composite component

i would like to add the content of a .css file to the shadow dom of a custom component derived from Composite<Div>.

for Example my code is as follow:

package AAA.BB.CCCCC.client.components;

import com.vaadin.flow.component.Composite;
import com.vaadin.flow.component.HasSize;
import com.vaadin.flow.component.Tag;
import com.vaadin.flow.component.dependency.CssImport;
import com.vaadin.flow.component.dependency.StyleSheet;
import com.vaadin.flow.component.html.H3;
import com.vaadin.flow.component.html.Div;
import com.vaadin.flow.component.html.H1;

//@CssImport(value = "./css/microItem.css", themeFor="Div")
public class MicroItemComponent extends Composite<Div> implements HasSize {

	private H1 property;
	private H3 title;

	public MicroItemComponent() {
		property = new H1();
		title    = new H3();
		getContent().add(title, property);
	public void setContent(String title1, String prop1)
	public void setTitle(String title)
	public void setProperty(String prop)
	public void setPropertyColor(String color)
	{"color", color);

	public void setPropertyColorDefault()

as you can see, i have tried @CssImport and @StyleSheet, but both metodes do not add the styles to the shadow dom of this component. Is there a way to do this by using a file, or do i have to do this all in java, by setting the styles with getStyle().set() ?

Thank you!


If you create a component this way you will not have any shadow DOM/shadow root. If you want a shadow root, you can extend PolymerTemplate and create the corresponding JS file. There you can also add styles that go into the shadow root. See e.g.

Thank you for your answer.
Sadly this is not really what i wanted to hear, but was afraid to.
The PolymerTemplate approach has two things i really do not like:

  1. Slow, and i do not know why… (see )
  2. The CSS is embedded in some nasty string inside java code. I would more like to have a separate css file i can edit, give the designer to modify, explicitly for this component…

Anyway… Now i know i have to use some other way.
Thank you!