# Where are my TailwindCSS classes?

Usually, TailwindCSS classes are added to the right HTML element via PHTML templates. However, our aim is that this is always done with the `$css()` utility as well.

**Bad example**:
```html
<div class="grid grid-cols-2"></div>
```

**Good example**:
```html
<div class="<?= $css('grid grid-cols-2') ?>"></div>
```

While this adds a lot of flexibility, it also makes analysing the source of TailwindCSS classes a bit harder. To analyse where TailwindCSS classes originate from when they are added to a specific block output, take the following steps:

- Scan the PHTML template. This is what you probably already have done, but it is simple step 1.

- Scan the XML layout for your specific block `name` with the argument `css_class` array set.

- Scan the XML layout for blocks that allow to define defaults for other blocks. For instance, the `loki-components.css_classes` block can be used to redefine CSS classes of any block. And the same applies to `loki-components.defaults.form.field` when it comes to `field.phtml` templates.

- Finally, even though it is a bit hard-code, use Xdebug (or some other means of debugging) on the `getCssClasses()` of the components `ViewModel` class.