Code
Bloc de code avec six thèmes de couleurs, nom du langage, numéros de ligne et bouton copier
Les exemples ne sont qu'une partie. Chaque tile a aussi les options avancées : animations, effets de souris, visibilité par appareil ou par date, position et bien plus encore.
01
Tout juste ajoutée
Voilà son aspect dès que tu l'ajoutes à la page, avant toute modification.
02
L'installation d'un plugin en ligne de commande
Thème One Dark, langage bash dans l'en-tête, numéros de ligne et bouton de copie, police à 15 px.
1 | wp plugin install olobuild --activate
2 | wp olobuild import contour.json --pages=all
3 | wp option update blogname "Contour Pilates"
4 | wp cache flush03
La configuration d'un capteur agricole
Thème clair dans un cadre blanc sur du papier quadrillé : JSON avec numéros de ligne et hauteur maximale, le reste se lit en faisant défiler.
1 | {
2 | "sonda": "campo-nord-07",
3 | "intervallo_minuti": 10,
4 | "misure": ["umidita_suolo", "temperatura", "conducibilita"],
5 | "allerta_gelo": {
6 | "soglia_celsius": 1.5,
7 | "avviso": "sms",
8 | "anticipo_ore": 12
9 | },
10 | "irrigazione": {
11 | "zona": "filari 12-18",
12 | "max_litri_giorno": 4200
13 | },
14 | "rete": "lora",
15 | "batteria": "solare"
16 | }04
Le calcul de l'hydratation dans une boulangerie
Thème Monokai sur un arrière-plan bleu, Python sans bouton de copie et avec les lignes longues qui passent à la ligne.
# Impasto della pagnotta di segale (pesi in grammi)
farina = {"segale": 600, "tipo_1": 400}
acqua = 780
lievito_madre = 200 # idratato al 100%: metà farina, metà acqua
totale_farina = sum(farina.values()) + lievito_madre / 2
idratazione = (acqua + lievito_madre / 2) / totale_farina
print(f"Idratazione: {idratazione:.0%}, sale: {totale_farina * 0.022:.0f} g")05
Une requête de la bibliothèque municipale
Thème Solarized Dark avec numéros de ligne et hauteur maximale, à peine incliné et avec une longue ombre, comme une feuille posée sur la table.
1 | SELECT titolo, autore, COUNT(*) AS prestiti
2 | FROM prestiti p
3 | JOIN libri l ON l.id = p.libro_id
4 | WHERE p.data >= DATE '2026-01-01'
5 | AND l.sezione = 'ragazzi'
6 | GROUP BY titolo, autore
7 | ORDER BY prestiti DESC
8 | LIMIT 10;06
Les tokens du thème Contour en CSS
Thème Dracula pleine largeur sur l'arrière-plan aurora : le CSS d'une card qui n'utilise que les couleurs du thème, avec une police à 16 px.
