# Effekte & Anpassungen

Diese Seite dokumentiert alle Operationen zum Anwenden visueller Effekte, Transformationen und Abstände auf Bilder.

### Blur

```
bl:%sigma
```

Wendet einen Gaußschen Weichzeichner auf das Bild an. Höhere Sigma-Werte erzeugen einen stärkeren Unschärfe-Effekt.

| Parameter | Typ   | Standard    | Erlaubte Werte                    |
| --------- | ----- | ----------- | --------------------------------- |
| sigma     | float | deaktiviert | Beliebige positive Gleitkommazahl |

**Beispiele:**

```
# Leichte Unschärfe
bl:3

# Starke Unschärfe (gut für Hintergrund-Overlays)
bl:15

# Dezente Unschärfe
bl:1.5
```

**Rewrite-Rule-Beispiel — unscharfe Hero-Hintergründe:**

Regex: `^/hero-bg/(.*)` Target: `/_sx/img/_/rs:fill:1920:600/bl:15/q:70/plain/$1`

Eine Anfrage an `/hero-bg/media/banner.jpg` liefert eine 1920×600 große, unscharfe Version des Bildes — ideal, um Text darüber zu legen.

***

### Sharpen

```
sh:%sigma
```

Wendet einen Schärfungsfilter auf das Bild an. Besonders nützlich, um Bilddetails nach der Skalierung zu verbessern.

| Parameter | Typ   | Standard    | Erlaubte Werte                    |
| --------- | ----- | ----------- | --------------------------------- |
| sigma     | float | deaktiviert | Beliebige positive Gleitkommazahl |

Als Richtwert:

| Sigma | Einsatzbereich                       |
| ----- | ------------------------------------ |
| `0.5` | Bildschirmdarstellung (\~4 Pixel/mm) |
| `1.0` | Druck bei 12 Pixel/mm                |
| `1.5` | Druck bei 300 DPI (16 Pixel/mm)      |

**Beispiele:**

```
# Leichte Schärfung für Webdarstellung
sh:0.5

# Moderate Schärfung
sh:1.0
```

***

### Pixelate

```
pix:%size
```

Wendet einen Verpixelungsfilter auf das Bild an. Der `size`-Parameter definiert die Größe jedes Pixelblocks im Ergebnis.

| Parameter | Typ     | Standard    | Erlaubte Werte              |
| --------- | ------- | ----------- | --------------------------- |
| size      | integer | deaktiviert | Beliebige positive Ganzzahl |

**Beispiele:**

```
# Moderate Verpixelung
pix:8

# Starke Verpixelung (starke Anonymisierung)
pix:20
```

**Rewrite-Rule-Beispiel — verpixelte Vorschaubilder:**

Regex: `^/preview/(.*)` Target: `/_sx/img/_/rs:fit:400:400/pix:10/q:60/plain/$1`

***

### Rotate

```
rot:%angle
```

Dreht das Bild im Uhrzeigersinn um den angegebenen Winkel. Nur 90-Grad-Schritte werden unterstützt. Die EXIF-Orientierung wird vor der Rotation angewendet, sofern die [automatische Rotation](#auto-rotate) nicht deaktiviert ist.

| Parameter | Typ     | Standard | Erlaubte Werte                             |
| --------- | ------- | -------- | ------------------------------------------ |
| angle     | integer | `0`      | `0`, `90`, `180`, `270` (Vielfache von 90) |

**Beispiele:**

```
# 90° im Uhrzeigersinn drehen
rot:90

# 180° drehen (auf den Kopf stellen)
rot:180

# 270° im Uhrzeigersinn (= 90° gegen den Uhrzeigersinn)
rot:270
```

***

### Auto Rotate

```
ar:%auto_rotate
```

Steuert die automatische Rotation basierend auf EXIF-Orientierungsmetadaten. Wenn aktiviert, liest smoxy das Orientierungs-Tag aus den Bildmetadaten und dreht das Bild entsprechend. Das Orientierungs-Tag wird unabhängig von dieser Einstellung immer aus dem Ergebnis entfernt.

| Parameter    | Typ     | Standard | Erlaubte Werte                                                      |
| ------------ | ------- | -------- | ------------------------------------------------------------------- |
| auto\_rotate | boolean | `true`   | `1`, `t`, `true` zum Aktivieren; `0`, `f`, `false` zum Deaktivieren |

**Beispiel:**

```
# Automatische Rotation deaktivieren
ar:false
```

***

### Background

```
bg:%R:%G:%B
bg:%hex_color
```

Setzt die Hintergrundfarbe, die beim Konvertieren von Bildern mit Transparenz (z. B. PNG zu JPEG), beim [Padding](#padding) und bei [Extend](https://docs.smoxy.eu/skalierung-and-zuschnitt#extend)-Operationen verwendet wird.

| Parameter  | Typ     | Standard | Erlaubte Werte                                     |
| ---------- | ------- | -------- | -------------------------------------------------- |
| R          | integer | —        | 0–255                                              |
| G          | integer | —        | 0–255                                              |
| B          | integer | —        | 0–255                                              |
| hex\_color | string  | —        | Beliebiger Hex-Farbwert (z. B. `ff0000`, `ffffff`) |

Ohne Argumente wird die Hintergrundmanipulation deaktiviert.

**Beispiele:**

```
# Weißer Hintergrund (RGB)
bg:255:255:255

# Weißer Hintergrund (Hex)
bg:ffffff

# Roter Hintergrund
bg:ff0000

# Hellgrauer Hintergrund
bg:f5f5f5
```

**Rewrite-Rule-Beispiel — PNG zu JPEG mit weißem Hintergrund:**

Regex: `^/jpg/(.*\.png)` Target: `/_sx/img/_/bg:ffffff/f:jpg/q:85/plain/$1`

***

### Padding

```
pd:%top:%right:%bottom:%left
```

Fügt Polsterung um das Bild herum hinzu, die mit der [Hintergrundfarbe](#background) gefüllt wird. Verwendet CSS-Kurzschreibweise. Padding wird **nach** allen anderen Transformationen (außer Wasserzeichen) angewendet und vergrößert die endgültigen Bildabmessungen.

| Parameter | Typ     | Standard | Erlaubte Werte                            |
| --------- | ------- | -------- | ----------------------------------------- |
| top       | integer | `0`      | Beliebige nicht-negative Ganzzahl (Pixel) |
| right     | integer | `0`      | Beliebige nicht-negative Ganzzahl (Pixel) |
| bottom    | integer | `0`      | Beliebige nicht-negative Ganzzahl (Pixel) |
| left      | integer | `0`      | Beliebige nicht-negative Ganzzahl (Pixel) |

#### Kurzschreibweise

| Format           | Bedeutung                                      |
| ---------------- | ---------------------------------------------- |
| `pd:10`          | 10px auf allen Seiten                          |
| `pd:10:20`       | 10px oben/unten, 20px links/rechts             |
| `pd:10:20:30`    | 10px oben, 20px links/rechts, 30px unten       |
| `pd:10:20:30:40` | 10px oben, 20px rechts, 30px unten, 40px links |

{% hint style="info" %}
**Hinweis:** Padding vergrößert das Ergebnisbild über die angeforderten Abmessungen hinaus. Bei einer Skalierung auf 100×200 und Anwendung von `pd:10` beträgt das Ergebnis 120×220 Pixel.
{% endhint %}

{% hint style="info" %}
**Hinweis:** Padding-Werte werden durch die [DPR](https://claude.ai/chat/resizing-and-cropping#dpr-device-pixel-ratio)-Einstellung beeinflusst und entsprechend skaliert.
{% endhint %}

**Beispiele:**

```
# 10px auf allen Seiten mit weißem Hintergrund
bg:ffffff/pd:10

# 20px oben/unten, 40px links/rechts
pd:20:40

# Asymmetrisches Padding
pd:10:20:30:40
```

**Rewrite-Rule-Beispiel — Produktbilder mit einheitlichem Padding:**

Regex: `^/product/(\d+)x(\d+)/(.*)` Target: `/_sx/img/_/rs:fit:$1:$2/bg:ffffff/pd:10/q:85/plain/$3`

So erhalten alle Produktbilder einheitliche Abmessungen mit weißem Rand — ideal für Raster-Layouts.