Panda CSS

CSS-in-JS 🔴 Senior

Definition

Framework CSS-in-JS zero-runtime avec une DX proche de Chakra UI. Genere du CSS atomique au build a partir d'une syntaxe objet. Supporte les patterns et recipes.

Analogie

Le successeur spirituel de Chakra UI mais sans poids JavaScript : meme confort, zero runtime.

Exemple de code

import { css } from '../styled-system/css'

const styles = css({
  display: 'flex',
  bg: 'blue.500',
  p: '4',
  _hover: { bg: 'blue.600' },
  md: { p: '8' },
})
<div className={styles}>Panda CSS</div>

Cas d'usage

Alternative zero-runtime a Chakra UI avec des tokens, patterns et recipes au build.

Termes lies

#styling#interview#css-in-js