Line Markers

Line markers highlight entire lines with a colored background and a left-edge accent border. Three marker types are available: mark (neutral highlight), ins (insertion), and del (deletion).

Mark lines

Add line numbers or ranges in curly braces after the language:

1
```go {2, 4-6}
2
func main() {
3
    name := "world"
4
    greeting := greet(name)
5
    fmt.Println(greeting)
6
    fmt.Println("done")
7
    fmt.Println("bye")
8
}
9
```

1
func main() {
2
    name := "world"
3
    greeting := greet(name)
4
    fmt.Println(greeting)
5
    fmt.Println("done")
6
    fmt.Println("bye")
7
}

→ Lines 2, 4, 5, and 6 have a yellow background with a left accent border.

Lines are 1-based and inclusive. Comma-separated values accept single numbers and ranges. A range like 4-6 covers lines 4, 5, and 6.

Insertion and deletion markers

Use ins= and del= to mark lines as added or removed. Insertion lines show a green background with a + indicator. Deletion lines show red with a - indicator.

1
```go title="diff.go" showLineNumbers {3} del={5-7} ins={9-11}
2
func process(items []string) ([]string, error) {
3
    var results []string
4
    for _, item := range items {
5
        val := item
6
        result, err := transform(val)
7
        if err != nil {
8
            return nil, err
9
        }
10
        cleaned := strings.TrimSpace(item)
11
        result := convert(cleaned)
12
        results = append(results, result)
13
    }
14
    return results, nil
15
}
16
```

1
func process(items []string) ([]string, error) {
2
    var results []string
3
    for _, item := range items {
4
        val := item
5
        result, err := transform(val)
6
        if err != nil {
7
            return nil, err
8
        }
9
        cleaned := strings.TrimSpace(item)
10
        result := convert(cleaned)
11
        results = append(results, result)
12
    }
13
    return results, nil
14
}

→ Line 3 is highlighted (mark), lines 5-7 show red deletion markers, and lines 9-11 show green insertion markers.

The add= and rem= aliases work identically to ins= and del=.

Labeled ranges

Add a label to any marker by placing a quoted string before the colon inside the braces. The label appears as a pill badge over the start of the first line in each range. Begin a labeled range on a blank line so the badge has that line to itself and does not cover code.

1
```go showLineNumbers {"Config":2-5} ins={"Added":6-11}
2
func NewServer(opts ...Option) *Server {
3
4
    cfg := defaultConfig()
5
    cfg.apply(opts)
6
    cfg.validate()
7
8
    return &Server{
9
        router: chi.NewRouter(),
10
        logger: cfg.logger,
11
        port:   cfg.port,
12
    }
13
}
14
```

1
func NewServer(opts ...Option) *Server {
2
3
    cfg := defaultConfig()
4
    cfg.apply(opts)
5
    cfg.validate()
6
7
    return &Server{
8
        router: chi.NewRouter(),
9
        logger: cfg.logger,
10
        port:   cfg.port,
11
    }
12
}

→ The "Config" badge sits on blank line 2, above the three configuration calls. The "Added" badge sits on blank line 6, above the return statement, with insertion styling.

Both double and single quotes work for labels. On labeled ins/del lines, the label badge replaces the +/- diff indicator.

Compact numeric labels work well for step-by-step annotations:

1
```go title="handler.go" showLineNumbers {"1":2-3} del={"2":5-6} ins={"3":8-9}
2
func handle(w http.ResponseWriter, r *http.Request) {
3
    ctx := r.Context()
4
    id := chi.URLParam(r, "id")
5
6
    data, err := fetchByID(id)
7
    if err != nil { http.Error(w, err.Error(), 500); return }
8
9
    result, err := svc.Process(ctx, id)
10
    if err != nil { http.Error(w, "processing failed", 500); return }
11
12
    json.NewEncoder(w).Encode(result)
13
}
14
```

1
func handle(w http.ResponseWriter, r *http.Request) {
2
    ctx := r.Context()
3
    id := chi.URLParam(r, "id")
4
5
    data, err := fetchByID(id)
6
    if err != nil { http.Error(w, err.Error(), 500); return }
7
8
    result, err := svc.Process(ctx, id)
9
    if err != nil { http.Error(w, "processing failed", 500); return }
10
11
    json.NewEncoder(w).Encode(result)
12
}

→ Three labeled ranges show a step-by-step code evolution: step 1 (mark), step 2 (deleted), step 3 (inserted).

Overlap priority

When multiple marker types overlap on the same line, the highest-priority marker wins:

For example, {1-10} ins={5} marks lines 1-4 and 6-10 as mark, but line 5 becomes ins. Labels from a lower-priority marker are cleared when a higher-priority marker overwrites the line.

Go API

Use the Options.LineMarkers field to set markers programmatically:

1
html, err := engine.Render(code, kazari.Options{
2
    Lang: "go",
3
    LineMarkers: []kazari.LineMarker{
4
        {Type: kazari.MarkerMark, Lines: []kazari.Range{{Start: 3, End: 5}}},
5
        {Type: kazari.MarkerIns, Lines: []kazari.Range{{Start: 8, End: 10}}, Label: "New"},
6
        {Type: kazari.MarkerDel, Lines: []kazari.Range{{Start: 6, End: 6}}},
7
    },
8
})

Syntax reference

CSS variables

See the CSS Variables reference for the complete list.

Edge cases

• The left accent border uses box-shadow: inset rather than CSS border-left to avoid layout shift.
• Labeled lines have a stronger background than unlabeled lines of the same type (--kz-label-mark-bg vs --kz-mark-bg).
• On highlighted lines, line numbers become more prominent (brighter color, higher opacity). See Line Numbers for details.
• Line markers are purely visual. They do not affect the copied code.