rotulo 0.2.0__tar.gz → 0.3.0__tar.gz

rotulo-0.3.0/.github/workflows/pages.yml

@@ -0,0 +1,41 @@
+name: demo
+
+on:
+  push:
+    branches: [develop]
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: true
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v7
+      - uses: actions/setup-python@v7
+        with:
+          python-version: '3.12'
+      - run: python -m pip install .
+      - run: python -m rotulo --out build --web demo/fonts
+      - run: cp web/rotulo.css demo/
+      - uses: actions/configure-pages@v5
+      - uses: actions/upload-pages-artifact@v3
+        with:
+          path: demo
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - id: deployment
+        uses: actions/deploy-pages@v4

{rotulo-0.2.0 → rotulo-0.3.0}/.gitignore

@@ -10,3 +10,5 @@ test-results
 web/fonts
 web/README.md
 web/LICENSE
+demo/fonts
+demo/rotulo.css

{rotulo-0.2.0 → rotulo-0.3.0}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.5
 Name: rotulo
-Version: 0.2.0
+Version: 0.3.0
 Summary: Monoline typeface generated from skeletons: strokes of lines and arcs expanded with a round pen.
 Author: Edgar Villarreal
 License-Expression: OFL-1.1
@@ -30,6 +30,8 @@ Monoline typeface generated from skeletons: strokes of lines and arcs expanded w
 
 ![Rotulo Display and Rotulo Lectura specimen](.github/assets/specimen.png)
 
+**[Live demo](https://ghegar.github.io/rotulo/)**
+
 Every letter is a skeleton of straight lines and arcs drawn in code, never a hand-drawn outline. The
 generator expands each skeleton with a round pen and writes TrueType and WOFF2 fonts. Weight is the
 pen width, so the family is a variable font from 200 to 700. A reading cut, **Lectura**, adds weight, spacing and
@@ -106,9 +108,10 @@ flag on `1` and a straight `9`.
 
 | Field | Default | What it controls |
 |---|---|---|
-| `weight` | 40 | Pen width |
+| `weight` | 46 | Pen width |
 | `x_height`, `cap_height` | 425, 700 | Body and capital heights |
-| `ascender`, `descender` | 840, −180 | Shared by every letter with a tail |
+| `ascender`, `descender` | 840, −415 | Shared by every letter with a tail; the descender matches the ascender's reach above the x-height |
+| `sign_descender` | −180 | Depth of brackets, braces, parentheses, `\|`, `/` and `_` |
 | `corner` | 50 | Radius used to round every skeleton vertex |
 | `gap` | 110 | Space between a stroke and a floating detail |
 | `spacing`, `word_spacing` | 1.5, 1.0 | Side bearings and space width |
@@ -120,7 +123,7 @@ from pathlib import Path
 
 from rotulo import DISPLAY, build_font
 
-print(build_font(replace(DISPLAY, weight=60), "Medium", 400, Path("build")))
+print(build_font(replace(DISPLAY, weight=70), "Medium", 400, Path("build")))
 ```
 
 ## Known limitations
@@ -139,6 +142,9 @@ ruff check src tests && ruff format --check src tests
 mypy
 ```
 
+The demo in `demo/` is a static specimen: build the fonts into it with
+`python -m rotulo --out build --web demo/fonts && cp web/rotulo.css demo/` and serve the folder.
+
 The tests build every font and check heights against the skeleton, kerning, the optional color layers, `ss01`,
 hinting and that the variable font interpolates every glyph.
 

{rotulo-0.2.0 → rotulo-0.3.0}/README.md

@@ -6,6 +6,8 @@ Monoline typeface generated from skeletons: strokes of lines and arcs expanded w
 
 ![Rotulo Display and Rotulo Lectura specimen](.github/assets/specimen.png)
 
+**[Live demo](https://ghegar.github.io/rotulo/)**
+
 Every letter is a skeleton of straight lines and arcs drawn in code, never a hand-drawn outline. The
 generator expands each skeleton with a round pen and writes TrueType and WOFF2 fonts. Weight is the
 pen width, so the family is a variable font from 200 to 700. A reading cut, **Lectura**, adds weight, spacing and
@@ -82,9 +84,10 @@ flag on `1` and a straight `9`.
 
 | Field | Default | What it controls |
 |---|---|---|
-| `weight` | 40 | Pen width |
+| `weight` | 46 | Pen width |
 | `x_height`, `cap_height` | 425, 700 | Body and capital heights |
-| `ascender`, `descender` | 840, −180 | Shared by every letter with a tail |
+| `ascender`, `descender` | 840, −415 | Shared by every letter with a tail; the descender matches the ascender's reach above the x-height |
+| `sign_descender` | −180 | Depth of brackets, braces, parentheses, `\|`, `/` and `_` |
 | `corner` | 50 | Radius used to round every skeleton vertex |
 | `gap` | 110 | Space between a stroke and a floating detail |
 | `spacing`, `word_spacing` | 1.5, 1.0 | Side bearings and space width |
@@ -96,7 +99,7 @@ from pathlib import Path
 
 from rotulo import DISPLAY, build_font
 
-print(build_font(replace(DISPLAY, weight=60), "Medium", 400, Path("build")))
+print(build_font(replace(DISPLAY, weight=70), "Medium", 400, Path("build")))
 ```
 
 ## Known limitations
@@ -115,6 +118,9 @@ ruff check src tests && ruff format --check src tests
 mypy
 ```
 
+The demo in `demo/` is a static specimen: build the fonts into it with
+`python -m rotulo --out build --web demo/fonts && cp web/rotulo.css demo/` and serve the folder.
+
 The tests build every font and check heights against the skeleton, kerning, the optional color layers, `ss01`,
 hinting and that the variable font interpolates every glyph.
 

rotulo-0.3.0/demo/index.html

@@ -0,0 +1,76 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>rotulo</title>
+        <link rel="icon" href="data:," />
+        <link rel="stylesheet" href="./styles.css" />
+    </head>
+    <body>
+        <main class="wrap">
+            <header class="top">
+                <h1>rotulo</h1>
+                <p>Monoline typeface generated from skeletons: strokes of lines and arcs expanded with a round pen.</p>
+                <nav>
+                    <a href="https://github.com/GHEgar/rotulo">GitHub</a>
+                    <a href="https://www.npmjs.com/package/rotulo">npm</a>
+                    <a href="https://pypi.org/project/rotulo/">PyPI</a>
+                    <a href="https://github.com/GHEgar/rotulo/releases/latest">Download TTF</a>
+                </nav>
+            </header>
+
+            <section class="controls">
+                <label for="weight">Weight <output id="weight-out">400</output></label>
+                <input id="weight" type="range" min="200" max="700" step="1" value="400" />
+                <label for="size">Size <output id="size-out">64</output></label>
+                <input id="size" type="range" min="12" max="160" step="1" value="64" />
+                <label class="check"><input id="reading" type="checkbox" /> Reading forms (ss01)</label>
+            </section>
+
+            <section class="sample" id="sample" contenteditable="true" spellcheck="false">Río Santiago</section>
+
+            <section class="grid">
+                <div>
+                    <h2>Lowercase</h2>
+                    <p class="glyphs">abcdefghijklmnñopqrstuvwxyz</p>
+                </div>
+                <div>
+                    <h2>Uppercase</h2>
+                    <p class="glyphs">ABCDEFGHIJKLMNÑOPQRSTUVWXYZ</p>
+                </div>
+                <div>
+                    <h2>Figures and signs</h2>
+                    <p class="glyphs">0123456789 &amp;@#%€$+=*_ [](){}&lt;&gt;|~ ¿?¡! «» “” … · —</p>
+                </div>
+                <div>
+                    <h2>Accents</h2>
+                    <p class="glyphs">áéíóúüñ àèìòù âêîôû ãõ ç ëïÿ ÁÉÍÓÚÜÑ ÀÈÌÒÙ ÂÊÎÔÛ ÃÕ Ç</p>
+                </div>
+            </section>
+
+            <section class="weights" id="weights"></section>
+
+            <section class="reading">
+                <h2>Rotulo Lectura</h2>
+                <p>A heavier, wider-spaced cut with letters that are hard to mirror, meant for long reading.</p>
+                <p class="lectura">Un buen mapa no se nota: el lector simplemente llega a donde quería ir. Las avenidas principales llevan un trazo ancho y las calles pequeñas uno fino; los nombres se leen en cualquier ángulo y sobre cualquier fondo. bdpq Il1 69</p>
+            </section>
+
+            <section class="map">
+                <h2>Map labels</h2>
+                <svg viewBox="0 0 800 340" role="img" aria-label="Map labels set in Rotulo">
+                    <rect width="800" height="340" class="land" />
+                    <path d="M-20 280 C 200 230, 420 310, 820 260" class="water" />
+                    <path d="M-20 130 L 820 80 M 300 -20 L 340 360 M 620 -20 L 580 360" class="road" />
+                    <text x="470" y="64" class="city">GUADALAJARA</text>
+                    <text x="150" y="200" class="town">Zapopan</text>
+                    <text x="160" y="120" class="street" transform="rotate(-3.4 160 120)">Av. Vallarta</text>
+                    <text x="200" y="252" class="river" transform="rotate(-6 200 252)">Río Santiago</text>
+                    <text x="690" y="328" class="coord">20°40′ N  103°21′ O</text>
+                </svg>
+            </section>
+        </main>
+        <script src="./main.js"></script>
+    </body>
+</html>

rotulo-0.3.0/demo/main.js

@@ -0,0 +1,27 @@
+const root = document.documentElement;
+const weight = document.getElementById('weight');
+const size = document.getElementById('size');
+const reading = document.getElementById('reading');
+
+const update = () => {
+    root.style.setProperty('--weight', weight.value);
+    root.style.setProperty('--size', `${size.value}px`);
+    document.getElementById('weight-out').textContent = weight.value;
+    document.getElementById('size-out').textContent = size.value;
+    document.body.classList.toggle('reading-forms', reading.checked);
+};
+
+const weights = document.getElementById('weights');
+for (const value of [200, 300, 400, 500, 600, 700]) {
+    const line = document.createElement('p');
+    line.style.fontWeight = String(value);
+    const label = document.createElement('span');
+    label.textContent = String(value);
+    line.append(label, document.createTextNode('Exportar mapa de Guadalajara'));
+    weights.append(line);
+}
+
+weight.addEventListener('input', update);
+size.addEventListener('input', update);
+reading.addEventListener('change', update);
+update();

rotulo-0.3.0/demo/styles.css

@@ -0,0 +1,232 @@
+@import url('./rotulo.css');
+
+:root {
+    --bg: #f3f4f1;
+    --card: #ffffff;
+    --ink: #1d2327;
+    --muted: #66706f;
+    --line: #dde1dc;
+    --accent: #2f5d62;
+    --land: #eceee6;
+    --water: #c9dde0;
+    --road: #ffffff;
+    --weight: 400;
+    --size: 64px;
+    color-scheme: light dark;
+}
+
+@media (prefers-color-scheme: dark) {
+    :root {
+        --bg: #161a1b;
+        --card: #1f2526;
+        --ink: #e6ebe8;
+        --muted: #93a09d;
+        --line: #2f3739;
+        --accent: #7fb7b5;
+        --land: #20272a;
+        --water: #1d3337;
+        --road: #2c3437;
+    }
+}
+
+* {
+    box-sizing: border-box;
+}
+
+body {
+    margin: 0;
+    background: var(--bg);
+    color: var(--ink);
+    font: 16px/1.5 'Rotulo', system-ui, sans-serif;
+}
+
+.wrap {
+    max-width: 1080px;
+    margin: 0 auto;
+    padding: 40px 20px 80px;
+    display: grid;
+    gap: 28px;
+}
+
+.top h1 {
+    margin: 0;
+    font-size: 72px;
+    font-weight: 300;
+    line-height: 1;
+}
+
+.top p {
+    margin: 8px 0 12px;
+    color: var(--muted);
+}
+
+nav {
+    display: flex;
+    gap: 16px;
+    flex-wrap: wrap;
+}
+
+a {
+    color: var(--accent);
+}
+
+h2 {
+    margin: 0 0 8px;
+    font-size: 13px;
+    font-weight: 500;
+    letter-spacing: 0.08em;
+    text-transform: uppercase;
+    color: var(--muted);
+}
+
+.controls {
+    position: sticky;
+    top: 0;
+    z-index: 1;
+    display: grid;
+    grid-template-columns: auto minmax(120px, 1fr) auto minmax(120px, 1fr) auto;
+    gap: 10px 14px;
+    align-items: center;
+    padding: 12px 16px;
+    background: var(--card);
+    border: 1px solid var(--line);
+    border-radius: 12px;
+}
+
+.controls input[type='range'] {
+    accent-color: var(--accent);
+}
+
+output {
+    font-variant-numeric: tabular-nums;
+}
+
+.sample {
+    font-size: var(--size);
+    font-weight: var(--weight);
+    line-height: 1.1;
+    outline: none;
+    overflow-wrap: anywhere;
+}
+
+.reading-forms .sample,
+.reading-forms .glyphs {
+    font-feature-settings: 'ss01';
+}
+
+.grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+    gap: 16px;
+}
+
+.grid > div,
+.reading,
+.map {
+    background: var(--card);
+    border: 1px solid var(--line);
+    border-radius: 12px;
+    padding: 16px;
+}
+
+.glyphs {
+    margin: 0;
+    font-size: 28px;
+    font-weight: var(--weight);
+    line-height: 1.4;
+    overflow-wrap: anywhere;
+}
+
+.weights {
+    display: grid;
+    gap: 4px;
+}
+
+.weights p {
+    margin: 0;
+    font-size: 32px;
+    display: flex;
+    gap: 16px;
+    align-items: baseline;
+}
+
+.weights span {
+    font-size: 12px;
+    color: var(--muted);
+    min-width: 3ch;
+    font-variant-numeric: tabular-nums;
+}
+
+.reading p {
+    margin: 0 0 8px;
+    color: var(--muted);
+}
+
+.lectura {
+    font-family: 'Rotulo Lectura', 'Rotulo', sans-serif;
+    font-size: 20px;
+    line-height: 1.7;
+    color: var(--ink) !important;
+    max-width: 65ch;
+}
+
+.map svg {
+    width: 100%;
+    height: auto;
+    display: block;
+    border-radius: 8px;
+}
+
+.land {
+    fill: var(--land);
+}
+
+.water {
+    fill: none;
+    stroke: var(--water);
+    stroke-width: 24;
+}
+
+.road {
+    fill: none;
+    stroke: var(--road);
+    stroke-width: 10;
+}
+
+.map text {
+    fill: var(--ink);
+    text-anchor: middle;
+    paint-order: stroke;
+    stroke: var(--land);
+    stroke-width: 4px;
+    stroke-linejoin: round;
+}
+
+.city {
+    font-size: 30px;
+    font-weight: 500;
+    letter-spacing: 0.08em;
+}
+
+.town {
+    font-size: 20px;
+}
+
+.street,
+.river {
+    font-size: 14px;
+}
+
+.coord {
+    font-size: 11px;
+}
+
+@media (max-width: 640px) {
+    .controls {
+        grid-template-columns: auto 1fr;
+    }
+
+    .top h1 {
+        font-size: 52px;
+    }
+}

{rotulo-0.2.0 → rotulo-0.3.0}/docs/CHANGELOG.md

@@ -5,6 +5,16 @@ Formato basado en [Keep a Changelog](https://keepachangelog.com/es-ES/1.1.0/) y
 
 ## [No publicado]
 
+## [0.3.0] - 2026-10-16
+
+### Cambiado
+
+- Las colas descendentes (`g`, `j`, `p`, `q`, `y`) bajan lo mismo que suben las ascendentes sobre la
+  altura x: descendente −415 en Display y −370 en Lectura. Corchetes, llaves, paréntesis, `|`, `/` y `_`
+  conservan la profundidad de −180, en el nuevo `sign_descender`.
+- Trazo un 15 % más grueso en toda la rampa: 46 en Display (peso 200), 86 en el peso 500 y en Lectura,
+  y 122 en el peso 700.
+
 ## [0.2.0] - 2026-10-16
 
 ### Cambiado

{rotulo-0.2.0 → rotulo-0.3.0}/pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "hatchling.build"
 
 [project]
 name = "rotulo"
-version = "0.2.0"
+version = "0.3.0"
 description = "Monoline typeface generated from skeletons: strokes of lines and arcs expanded with a round pen."
 readme = "README.md"
 license = "OFL-1.1"

{rotulo-0.2.0 → rotulo-0.3.0}/src/rotulo/build.py

@@ -10,7 +10,7 @@ from rotulo.params import Params
 from rotulo.spacing import kerning
 
 FAMILY = "Rotulo"
-VERSION = "0.2.0"
+VERSION = "0.3.0"
 LICENSE = "This Font Software is licensed under the SIL Open Font License, Version 1.1."
 LICENSE_URL = "https://openfontlicense.org"
 DETAIL_LIGHT = (0x3D / 255, 0x8A / 255, 0x8F / 255, 1.0)

{rotulo-0.2.0 → rotulo-0.3.0}/src/rotulo/context.py

@@ -37,6 +37,7 @@ class Context:
         self.cap = p.cap_height
         self.asc = p.ascender
         self.desc = p.descender
+        self.sign_desc = p.sign_descender
         self.w = p.weight
         self.o = self.xh * p.overshoot / 100
         self.gap = p.gap

{rotulo-0.2.0 → rotulo-0.3.0}/src/rotulo/figures.py

@@ -34,7 +34,7 @@ def add_figures(ctx: Context) -> None:
         ctx.cap,
         ctx.xh,
         ctx.asc,
-        ctx.desc,
+        ctx.sign_desc,
         ctx.o,
         ctx.w,
         ctx.gap,

{rotulo-0.2.0 → rotulo-0.3.0}/src/rotulo/params.py

@@ -10,11 +10,12 @@ GForm = Literal["bar", "curl"]
 
 @dataclass(frozen=True)
 class Params:
-    weight: float = 40
+    weight: float = 46
     x_height: float = 425
     cap_height: float = 700
     ascender: float = 840
-    descender: float = -180
+    descender: float = -415
+    sign_descender: float = -180
     width: float = 1.0
     aperture: float = 30
     gap: float = 110
@@ -43,8 +44,9 @@ class Params:
 DISPLAY = Params()
 READING = replace(
     DISPLAY,
-    weight=75,
+    weight=86,
     x_height=470,
+    descender=-370,
     spacing=1.8,
     word_spacing=1.6,
     l_form="tail",

{rotulo-0.2.0 → rotulo-0.3.0}/src/rotulo/symbols.py

@@ -22,7 +22,7 @@ def add_symbols(ctx: Context) -> None:
         ctx.cap,
         ctx.xh,
         ctx.asc,
-        ctx.desc,
+        ctx.sign_desc,
         ctx.o,
         ctx.dot_len,
         ctx.dv,

{rotulo-0.2.0 → rotulo-0.3.0}/src/rotulo/variable.py

@@ -50,7 +50,7 @@ def _compatible(sets: list[GlyphSet]) -> None:
 
 
 def build_variable(
-    out: Path, light: Params = DISPLAY, middle_weight: float = 75, heavy_weight: float = 106
+    out: Path, light: Params = DISPLAY, middle_weight: float = 86, heavy_weight: float = 122
 ) -> Path:
     masters = [light, replace(light, weight=heavy_weight)]
     sets = [collect(p, draw=capsules) for p in masters]

{rotulo-0.2.0 → rotulo-0.3.0}/web/package.json

@@ -1,6 +1,6 @@
 {
     "name": "rotulo",
-    "version": "0.2.0",
+    "version": "0.3.0",
     "description": "Monoline typeface generated from skeletons: strokes of lines and arcs expanded with a round pen.",
     "keywords": [
         "font",