escape-hatch.mdx

title
Escape Hatch

import { Tabs, Tab, Callout } from 'nextra-theme-docs'; import { CodeOutput } from '../../../components/CodeOutput';

Escape Hatch

Typewind provides an escape hatch as well, which directly adds the given string to the output. This is not recommended, but can be useful in some cases.

import { tw } from 'typewind';

export default function App() {
  return (
    <button className={tw.raw("bg-blue-500")}>Click Me</button>
  );
}

<Tabs items={['Code Output', 'Result']}> tsx <button className="bg-blue-500">Click Me</button> Click Me

For more reference, checkout the [Tailwind Docs for Arbitrary Values](https://tailwindcss.com/docs/adding-custom-styles#using-arbitrary-values).