--- title: "EFFECT" manual: "TypoScript Explained" version: "main" permalink: "https://docs.typo3.org/permalink/t3tsref:gifbuilder-effect@main" source: "Gifbuilder/ObjectNames/Effect/Index.rst" rendered: "2026-09-19T06:55:14+00:00" --- # EFFECT {#gifbuilder-effect} The `EFFECT` object allows to apply one or more of the [following effects](https://docs.typo3.org/permalink/t3tsref:gifbuilder-effect-effects@main) to the image. It has only one property: `value`. [stdWrap](https://docs.typo3.org/permalink/t3tsref:stdwrap@main) is available for `value`. ## Syntax {#gifbuilder-effect-syntax} **Syntax** ```none 20 = EFFECT 20.value = = | = ``` All effects are defined as the effect only or as an effect/value pair inside `value`. Multiple effects or effect/value pairs are separated by `|`. ## Example {#gifbuilder-effect-example} **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript lib.image = IMAGE lib.image { file = GIFBUILDER file { XY = 1024,768 format = jpg 10 = IMAGE 10.file = fileadmin/image.jpg 20 = EFFECT 20.value = gamma=1.3 | flip | rotate=180 } } ``` ## Effects {#gifbuilder-effect-effects} - [blur](https://docs.typo3.org/permalink/t3tsref:blur@main) - [charcoal](https://docs.typo3.org/permalink/t3tsref:charcoal@main) - [colors](https://docs.typo3.org/permalink/t3tsref:colors@main) - [edge](https://docs.typo3.org/permalink/t3tsref:edge@main) - [emboss](https://docs.typo3.org/permalink/t3tsref:emboss@main) - [flip](https://docs.typo3.org/permalink/t3tsref:flip@main) - [flop](https://docs.typo3.org/permalink/t3tsref:flop@main) - [gamma](https://docs.typo3.org/permalink/t3tsref:gamma@main) - [gray](https://docs.typo3.org/permalink/t3tsref:gray@main) - [invert](https://docs.typo3.org/permalink/t3tsref:invert@main) - [rotate](https://docs.typo3.org/permalink/t3tsref:rotate@main) - [sharpen](https://docs.typo3.org/permalink/t3tsref:sharpen@main) - [shear](https://docs.typo3.org/permalink/t3tsref:shear@main) - [solarize](https://docs.typo3.org/permalink/t3tsref:solarize@main) - [swirl](https://docs.typo3.org/permalink/t3tsref:swirl@main) - [wave](https://docs.typo3.org/permalink/t3tsref:wave@main) ### blur {#gifbuilder-effect-blur} - **blur** - *Type:* integer (1-99) - *Default:* 0 Blurs the edges inside the image. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = blur=10 ``` ### charcoal {#gifbuilder-effect-charcoal} - **charcoal** - *Type:* integer (0-100) - *Default:* 0 Makes the image look as if it has been drawn with charcoal and defines the intensity of that effect. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = charcoal=5 ``` ### colors {#gifbuilder-effect-colors} - **colors** - *Type:* integer (2-255) Defines the number of different colors to use in the image. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = colors=100 ``` ### edge {#gifbuilder-effect-edge} - **edge** - *Type:* integer (0-99) - *Default:* 0 Detect edges within an image. This is a gray-scale operator, so it is applied to each of the three color channels separately. The value defines the radius for the edge detection. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = edge=8 ``` ### emboss {#gifbuilder-effect-emboss} - **emboss** Creates a relief effect: Creates highlights or shadows that replace light and dark boundaries in the image. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = emboss ``` ### flip {#gifbuilder-effect-flip} - **flip** Vertical flipping. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = flip ``` ### flop {#gifbuilder-effect-flop} - **flop** Horizontal flipping. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = flop ``` ### gamma {#gifbuilder-effect-gamma} - **gamma** - *Type:* double (0.5 - 3.0) - *Default:* 1.0 Sets the [gamma](https://en.wikipedia.org/wiki/Gamma_correction) value. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = gamma=1.3 ``` ### gray {#gifbuilder-effect-gray} - **gray** The image is converted to gray tones. **Example:** This gives the image a slight [wave](https://docs.typo3.org/permalink/t3tsref:gifbuilder-effect-wave@main) and renders it in gray. **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = wave=1,20 | gray ``` ### invert {#gifbuilder-effect-invert} - **invert** Invert the colors. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = invert ``` ### rotate {#gifbuilder-effect-rotate} - **rotate** - *Type:* integer (0-360) - *Default:* 0 Number of degrees for a clockwise rotation. Image dimensions will grow if needed, so that nothing is cut off from the original image. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = rotate=180 ``` ### sharpen {#gifbuilder-effect-sharpen} - **sharpen** - *Type:* integer (0-99) - *Default:* 0 Sharpens the edges inside the image. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = sharpen=12 ``` ### shear {#gifbuilder-effect-shear} - **shear** - *Type:* integer (-90 - 90) - *Default:* 0 Number of degrees for a horizontal shearing. Horizontal shearing slides one edge of the image along the X axis, creating a parallelogram. Provide an integer between -90 and 90 for the number of degrees. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = shear=-30 ``` ### solarize {#gifbuilder-effect-solarize} - **solarize** - *Type:* integer (0-99) - *Default:* 0 Color reduction, "burning" the brightest colors black. The brighter the color, the darker the solarized color is. This happens in photography when chemical film is over exposed. The value sets the grayscale level above which the color is negated. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = solarize=15 ``` ### swirl {#gifbuilder-effect-swirl} - **swirl** - *Type:* integer (0-1000) - *Default:* 0 The image is swirled or spun from its center. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = swirl=200 ``` ### wave {#gifbuilder-effect-wave} - **wave** - *Type:* integer,integer (both 0-99) - *Default:* 0,0 Provide values for the amplitude and the length of a wave, separated by comma. All horizontal edges in the image will then be transformed by a wave with the given amplitude and length. **Example:** **EXT:site_package/Configuration/Sets/Main/setup.typoscript** ```typoscript 20 = EFFECT 20.value = wave=1,20 ```