An unnamed playground on Frontend.fyi

Mass PRO

1
export default function App(){
2
  return(
3
    <div>
4
      <motion.button className="text-white">Bello</motion.button>
5
    </div>
6
  )
7
}
8
import {motion} from "motion"

1
@theme {
2
  --color-primary: #7f22fe;
3
  --color-background: #131018;
4
}
5

6
@layer base {
7
  :root {
8
    background-color: var(--color-background);
9
  }
10
}

1
import React from 'react';
2
import ReactDOM from 'react-dom/client';
3
import './styles.css';
4
import { App } from './app.jsx';
5

6
ReactDOM.createRoot(
7
  document.querySelector('#root')
8
).render(<App />);

1
<html>
2
<head></head>
3
<body>
4
<script type="importmap">
5
{
6
  "imports": {
7
  "@jsxImportSource": "https://esm.sh/react",
8
  "react": "https://esm.sh/react",
9
  "react-dom": "https://esm.sh/react-dom",
10
  "react/jsx-runtime": "https://esm.sh/react/jsx-runtime"
11
}
12
}
13
</script>
14
</body>
15
</html>

1
{
2
  "compilerOptions": {
3
    "target": "ES2020",
4
    "module": "ESNext",
5
    "moduleResolution": "node",
6
    "lib": [
7
      "ES2020",
8
      "DOM",
9
      "DOM.Iterable"
10
    ],
11
    "skipLibCheck": true,
12
    "strict": false,
13
    "esModuleInterop": true,
14
    "allowSyntheticDefaultImports": true,
15
    "forceConsistentCasingInFileNames": true,
16
    "resolveJsonModule": true,
17
    "jsx": "react-jsx",
18
    "jsxImportSource": "react"
19
  }
20
}

Could not render preview

There was an error rendering the preview. Please try again later.

Are you the owner of this playground? Try fixing the error by editing the code.

Open Playground