Inline Markers

Inline markers highlight specific text within code lines. They match by literal string or regex pattern and render as <mark>, <ins>, or <del> elements with a colored background pill.

Text markers

Place a quoted string in the meta string to highlight all occurrences of that text across every line:

1
```typescript title="cache.ts" showLineNumbers "CacheEntry" ins="factory"
2
interface CacheEntry {
3
    key: string
4
    value: unknown
5
    ttl: number
6
}
7
8
function factory(key: string): CacheEntry {
9
    return { key, value: null, ttl: 300 }
10
}
11
```

1
interface CacheEntry {
2
    key: string
3
    value: unknown
4
    ttl: number
5
}
6
7
function factory(key: string): CacheEntry {
8
    return { key, value: null, ttl: 300 }
9
}

→ Every occurrence of CacheEntry shows a neutral highlight pill. factory shows a green insertion pill.

Bare quoted strings produce the default mark type (neutral highlight). Prefix with ins= or del= for typed markers. Both double quotes ("text") and single quotes ('text') are accepted.

Regex markers

Use forward slashes to match a regular expression pattern:

1
```go title="regex-markers.go" showLineNumbers /err\b/ ins=/func\s+\w+/ del=/fmt\.Errorf/
2
func loadConfig(path string) (*Config, error) {
3
    data, err := os.ReadFile(path)
4
    if err != nil {
5
        return nil, fmt.Errorf("read config: %w", err)
6
    }
7
8
    var cfg Config
9
    if err := json.Unmarshal(data, &cfg); err != nil {
10
        return nil, fmt.Errorf("parse config: %w", err)
11
    }
12
    return &cfg, nil
13
}
14
```

1
func loadConfig(path string) (*Config, error) {
2
    data, err := os.ReadFile(path)
3
    if err != nil {
4
        return nil, fmt.Errorf("read config: %w", err)
5
    }
6
7
    var cfg Config
8
    if err := json.Unmarshal(data, &cfg); err != nil {
9
        return nil, fmt.Errorf("parse config: %w", err)
10
    }
11
    return &cfg, nil
12
}

→ Matches of /err\b/ show neutral highlight pills. /func\s+\w+/ shows green insertion pills. /fmt\.Errorf/ shows red deletion pills.

Bare /pattern/ produces the mark type. Prefix with ins= or del= for typed matches. Escape forward slashes within the pattern with \/. Invalid regex patterns are silently ignored.

Capture groups

Use (...) to highlight only the captured portion of a regex match. Use (?:...) for a non-capturing group that highlights the full match. Only the first capturing group is used; additional groups are ignored.

1
```python title="capture_group.py" /ye(s|p)/
2
result = "yes" if check() else "yep"
3
print("nope")
4
```

1
result = "yes" if check() else "yep"
2
print("nope")

→ The regex /ye(s|p)/ matches yes and yep, but only s and p are highlighted (the captured groups). nope is not matched.

Multi-token spanning

When a match crosses syntax token boundaries, Kazari splits the highlight across the affected tokens and joins them visually into a single continuous pill. This works automatically using open-start and open-end CSS classes that remove borders and border radius at the join point.

Overlap priority

Inline markers share the same priority system as line markers: ins > del > mark. When two inline markers overlap on the same characters, the higher-priority marker claims its range. The lower-priority match survives only in the non-overlapping fragments.

For example, "abcdef" ins="cd" produces three segments: ab (mark), cd (ins), ef (mark).

Combined with line markers

Inline markers and line markers are independent. A line can have both a line-level highlight (colored background) and inline text highlights within it:

1
```go title="combined.go" showLineNumbers {4-5} ins={10-12} del={6-8} "db"
2
func main() {
3
    ctx := context.Background()
4
5
    db, err := sql.Open("postgres", dsn)
6
    if err != nil { log.Fatal(err) }
7
    defer db.Close()
8
    cache := newCache()
9
    cache.Warm(ctx)
10
11
    svc := newService(db, cache)
12
    srv := newServer(svc, db)
13
    srv.Run(ctx)
14
}
15
```

1
func main() {
2
    ctx := context.Background()
3
4
    db, err := sql.Open("postgres", dsn)
5
    if err != nil { log.Fatal(err) }
6
    defer db.Close()
7
    cache := newCache()
8
    cache.Warm(ctx)
9
10
    svc := newService(db, cache)
11
    srv := newServer(svc, db)
12
    srv.Run(ctx)
13
}

→ Lines 4-5 have a yellow mark background with inline db highlight pills. Lines 6-8 have red deletion backgrounds. Lines 10-12 have green insertion backgrounds. The db text is highlighted on every line where it appears.

Go API

Use the Options.InlineMarkers field to set markers programmatically:

1
html, err := engine.Render(code, kazari.Options{
2
    Lang: "go",
3
    InlineMarkers: []kazari.InlineMarker{
4
        {Type: kazari.MarkerMark, Text: "CacheEntry"},
5
        {Type: kazari.MarkerIns, Text: `func\s+\w+`, IsRegex: true},
6
    },
7
})

Syntax reference

CSS variables

See the CSS Variables reference for the complete list.

Edge cases

• Matching is case-sensitive. "useState" matches useState but not usestate.
• All occurrences across all lines are matched, not just the first.
• On lines with a line marker background, all token colors on that line (including text inside inline markers) are contrast-adjusted against the line marker background, not the editor background. This is a per-line effect driven by line-level markers.
• Inline markers are purely visual. They do not affect the copied code.