# Styling with Tailwind in admin area

**URL:** https://discourse.roots.io/t/styling-with-tailwind-in-admin-area/19674
**Category:** sage
**Tags:** acf
**Created:** 2020-12-02T15:46:03Z
**Posts:** 3

## Post 1 by @maroluke — 2020-12-02T15:46:04Z

How could one apply allready installed and working (in Frontend) tailwindcss to the admin area?  
Actually i want to style custom gutenberg blocks created with ACF.  
Was trying to enqueue styles with `enqueue_style` in `acf_register_block_type` without success:

```
// Custom Block Type
add_action('acf/init', 'fundament_acf_init_block_types');
function fundament_acf_init_block_types() {

    // Check function exists.
    if( function_exists('acf_register_block_type') ) {

        // register a testimonial block.
        acf_register_block_type(array(
            'name' => 'entry-block',
            'title' => __('Entry Block'),
            'description' => __('Block element for creating full width page entry.'),
            'render_template' => get_template_directory().'/views/blocks/entry-block.php',
            'enqueue_style' => get_template_directory_uri().'/assets/styles/blocks/main.scss',
            'category' => 'formatting',
            'icon' => 'admin-site-alt',
            'keywords' => array( 'entry', 'index', 'start', 'home' ),
        ));
    }
}
```

---

## Post 2 by @byoungz — 2020-12-02T17:10:44Z

I imported tailwind into my edtior.scss file so at the top of my `resources/styles/editor.scss` looks like:

```
@import 'config/fonts';

@import 'config/variables';

@tailwind base;

@tailwind components;

@tailwind utilities;
```

---

## Post 3 by @maroluke — 2020-12-02T20:01:06Z

Thank you!  
How do you get editor.scss working properly?  
Did you enqueue it somewhere?  
How does WP know it has to load this css only in admin?

I found a serious post about how to implement css files for gutenberg editor: [Post by @Simeon](https://discourse.roots.io/t/how-to-create-and-use-a-separate-css-file-for-gutenberg-editor-in-sage-9/12847)

So i edited config.json adding this:

```
"gutenberg": ["./styles/gutenberg.scss"],
```

and in my setup.php adding this:

```
add_action('enqueue_block_editor_assets', function () {
     wp_enqueue_style('sage/gutenberg.css', asset_path('styles/gutenberg.css'), false, null);
});
```

But somehow I have not yet got it working. If i look into the console while i’m editing a gutenberg block, i get an 404 error for this gutenberg.css: **MIME-Type conflict**

---

## Post 4 by @system — 2021-01-13T15:46:07Z

This topic was automatically closed after 42 days. New replies are no longer allowed.