JSON Snippet

Pretty-printed JSON object with sky keys, emerald strings, and amber numerics.

{
"name":"Beste",
"version":"1.0.0",
"active":true,
"count":42,
"owner":null
}

New here? Read the installation guide.

Import & use
import { Code7 } from "@/components/beste/piece/code7";

<Code7
  entries={[
    {
      "key": "name",
      "value": "Beste"
    },
    {
      "key": "version",
      "value": "1.0.0"
    },
    {
      "key": "active",
      "value": true
    },
    {
      "key": "count",
      "value": 42
    },
    {
      "key": "owner",
      "value": null
    }
  ]}
/>

More Code pieces

View all Code
const user = await fetchUser("42");

Tokenized Line

Single-line snippet with keywords, strings, and function names colored by semantic token kind.

members.ts
import { Sirius } from '@sirius/sdk'
 
const client = new Sirius(apiKey)
await client.members.create({ name })

SDK Snippet Card

A code card with a filename header and copy affordance over syntax-toned, line-numbered source.

greet.ts
export function greet(name: string) {
  return `Hello, ${name}!`;
}
 
console.log(greet("Beste"));

Code Snippet Card

Dark editor card with three traffic-light dots, a filename tab, and line-numbered code.

const greeting = "Hello, Beste!";ts

Code Line

One-line code snippet with a monospace pill and a tiny language tag on the right.

SELECT id, name, email
FROM users
WHERE active = true
ORDER BY created_at DESC
LIMIT 10;

SQL Query

Multi-line SQL with violet keywords, emerald string literals, and amber numerics.

function greet(name) {
return 'Hi ' + name;
return `Hello, ${name}!`;
}

Diff Snippet

Compact diff card with added, removed, and context lines tinted in emerald and rose.

Markdown version