Allow @plugins support in Global CSS
>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3553356. --> Reported by: [spleshka](https://www.drupal.org/user/810676) Related to !580 !515 >>> <h3 id="overview">Overview</h3> <p>Drupal Canvas currently ships with a default global CSS file that includes Tailwind CSS support. This is a great starting point for building modern UIs inside the Canvas ecosystem.</p> <p>However, for professional theming and design-system development, many teams rely on additional Tailwind plugins to extend functionality - for example tailwindcss-react-aria-components (for accessible React-based components) or tailwindcss-animate (for consistent motion and transitions). In our case both these plugins are needed to connect Untitled UI kit to the Drupal Canvas system.</p> <p>At the moment, it&rsquo;s not possible to register extra Tailwind plugins within the Canvas build process. This limits flexibility and prevents teams from building advanced, production-grade UI systems within Canvas.</p> <p>We&rsquo;d like to propose an improvement to allow arbitrary Tailwind plugin registration, or at least enable a curated list of the most-used and officially supported plugins.</p> <p>List of (some of the) widely used Tailwind plugins:</p> <ul> <li><strong>@tailwindcss/forms</strong> - improved default styling for form controls</li> <li><strong>@tailwindcss/typography</strong> - &ldquo;prose&rdquo; styles for content-rich elements</li> <li><strong>@tailwindcss/container-queries</strong> - support for container queries</li> <li><strong>@tailwindcss/line-clamp</strong> - utilities for truncating long text</li> <li><strong>tailwindcss-animate</strong> - animation utilities for motion design</li> <li><strong>tailwindcss-react-aria-components</strong> - accessibility-focused component styling</li> <li><strong>tailwind-scrollbar</strong> / <strong>tailwind-scrollbar-hide</strong> - scrollbar styling utilities</li> <li><strong>tailwindcss-flip</strong> - RTL support via automatic layout flipping</li> <li><strong>tailwindcss-opentype</strong> - advanced typographic features and ligatures</li> </ul> <h3 id="proposed-resolution">Proposed resolution</h3> <ul> <li>add support for Tailwind CSS plugins in the tailwindcss-in-browser library (<a href="https://github.com/balintbrews/tailwindcss-in-browser/pull/22">https://github.com/balintbrews/tailwindcss-in-browser/pull/22</a>)</li> <li>update tailwindcss-in-browser version used in canvas</li> <li>bundle official @tailwindcss/typography plugin to make it available by default</li> </ul> <h3 id="ui-changes">User interface changes</h3> <p>None.</p> > Related issue: [Issue #3572777](https://www.drupal.org/node/3572777)
issue