Code highlighting via the CSS Custom Highlight API. Zero runtime dependencies. No <span> elements.
<!DOCTYPE html>
<html lang=en>
<head>
<meta charset=UTF-8>
<title>My Page</title>
</head>
<body>
<h1>Hello, World!</h1>
<p class=intro>Welcome.</p>
</body>
</html># Getting Started
Install the package with `npm install example`, then read the **usage**
guide or check the _API reference_.
> Requires support for the Amazing API.
* Zero dependencies
* Zero maintenance
* [Read the docs](https://example.com/)/* Reset */
*,
*::before,
*::after {
box-sizing: border-box;
margin: ;
padding: ;
}
body {
font-family: system-ui, sans-serif;
line-height: 1.6;
color: #1a1a1a;
background-color: #ffffff;
}
.container {
max-width: 800px;
margin: auto;
padding: 2rem;
}// Fetch and display user data
async function fetchUser(id) {
try {
const response = await fetch(`/api/users/${id}`);
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
const user = await response.json();
console.log(`User: ${user.name}`);
return user;
} catch (err) {
console.error("Failed to fetch user:", err.message);
return null;
}
}
const app = {
name: "My App",
version: "1.0.0",
init() {
console.log(`${this.name} v${this.version} initialized`);
}
};
export default app;interface User {
id: number;
name: string;
email: string;
role: "admin" | "user" | "guest";
}
async function getUsers<T extends User>(
limit: number = 10
): Promise<T[]> {
const res = await fetch(`/api/users?limit=${limit}`);
const json = await res.json();
return json.data as T[];
}
export { getUsers };
export type { User };# Fetch and display user data
import json
from urllib.request import urlopen
class UserError(Exception):
pass
def fetch_user(user_id: int) -> dict:
with urlopen(f"https://example.com/api/users/{user_id}") as response:
if response.status != 200:
raise UserError(f"HTTP {response.status}")
return json.load(response)
def main():
user = fetch_user(42)
print(f"User: {user['name']}")
if __name__ == "__main__":
main()# Install dependencies
npm install
# Run development server
npm run dev -- --port 3000
# Build for production
NODE_ENV=production npm run build
# Deploy to server
ssh deploy@server.example.com "cd /var/www && git pull && pm2 restart app"{
"name": "My App",
"version": "1.0.0",
"private": true,
"scripts": {
"build": "node scripts/build.mjs",
"test": "node --test"
},
"dependencies": {
"esbuild": "^0.28.1"
},
"strict": true,
"legacy": false,
"proxy": null
}# Deployment config
name: My App
version: 1.0.0
private: true
env:
- NODE_ENV=production
- PORT=3000
build:
command: "npm run build"
output: dist/
retries: 3SELECT customers.name, COUNT(orders.id) AS order_count
FROM customers
INNER JOIN orders ON orders.customer_id = customers.id
WHERE orders.created_at >= '2026-01-01'
GROUP BY customers.name
ORDER BY order_count DESC
LIMIT 10;{# Render a list of active users #}
{% for user in users %}
{% if user.active %}
<li>{{ user.name | upper }}</li>
{% endif %}
{% endfor %}
{% set greeting = "Hello, " ~ user.name ~ "!" %}
{{ greeting }}diff --git a/syntaxp.js b/syntaxp.js
index 1a2b3c4..5d6e7f8 100644
--- a/syntaxp.js
+++ b/syntaxp.js
@@ -14,6 +14,7 @@ const languages = {
html: [ … ],
css: [ … ],
+ json: [ … ],
js: [ … ]
};GET /api/users/42 HTTP/1.1
Host: example.com
Authorization: Bearer abc123
Accept: application/json
HTTP/1.1 200 OK
Content-Type: application/json
Cache-Control: no-store
{"id": 42, "name": "Ada"}# Redirect to HTTPS and compress text assets
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
</IfModule>
Header always set X-Content-Type-Options "nosniff"
AddOutputFilterByType DEFLATE text/html text/css application/javascript“Use console.log("hello") for debugging”, “enter npm install to install.”