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 1920x600 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 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 und bei 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 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

INFO

Hinweis: Padding vergrößert das Ergebnisbild über die angeforderten Abmessungen hinaus. Bei einer Skalierung auf 100x200 und Anwendung von pd:10 beträgt das Ergebnis 120x220 Pixel.

INFO

Hinweis: Padding-Werte werden durch die DPR-Einstellung beeinflusst und entsprechend skaliert.

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.