Code Code - Docs - Artefact

Code Code

Typography

Tier 3

Introduction

Un élément <code> en ligne pour de courts extraits de code ou du texte monospace dans une ligne de prose.

Utilisation

npm installconst x = 5;GET /api/users

import { Code } from "../components/ui";

export default function MyPage() {
  return (
    <p>
      Run <Code>npm install</Code> to install dependencies.
    </p>
  );
}

Propriétés

Propriété	Type	Description
`children`	`Child`	Le contenu du code.
`variant`	`"solid" \| "surface" \| "subtle" \| "outline" \| "plain"`	Visual style. Default `"subtle"`.
`size`	`"sm" \| "md" \| "lg" \| "xl"`	Font/padding size. Default `"md"`.
`colorPalette`	`"blue" \| "vert" \| "red" \| "purple" \| "orange" \| "cyan" \| "yellow" \| "pink" \| "teal" \| "indigo" \| "gray" \| "success" \| "error" \| "warning"`	The color theme.
`class`	`string`	Classes CSS personnalisées.

Accessibilité

Code restitue un élément <code> natif, donc les lecteurs d'écran l'annoncent comme contenu du code sans câblage ARIA supplémentaire nécessaire. Pour les blocs de code multilignes, enroulez vous-même un <pre> — Code ne stylise que la casse en ligne.