Skip to content
Search
Ctrl
K
Cancel
Home
Demos
Docs
Api specs
Resources
Team
Docs
Getting started
Getting started
Your first app
Core concepts
Configuring defaults properties
Configuring controls
Cropping images
Working with events
Objects and custom properties
Using gradients
Caching of object, properties and behavior
Upgrading
Upgrading to Fabric.js 7.0
Upgrading to Fabric.js 6.0
Introduction to Fabric.js
Old docs
Changelog
Changelog v1
ClipPath introdcution
ClipPath more advanced use cases
ClipPath - clipping the canvas
Clipping the objects with absolute clipPaths
Custom controls api
Fabric filters
Introduction to Fabric.js. Part 1
Introduction to Fabric.js. Part 2
Introduction to Fabric.js. Part 3
Introduction to Fabric.js. Part 4
Introduction to Fabric.js. Part 5
Fabric.js Text
Frequent issues / gotchas
Gradients
Subclassing Text class to make a bitmap text
Breaking changes upgrade guide
Using transformations
Upgrade to fabric 2.x
Upgrade to fabric 4.x
Upgrade to fabric 5.x
Transformations
Fabric.js
Api
fabric
classes
ActiveSelection
BaseBrush
BaseFabricObject
Canvas
Canvas2dFilterBackend
CanvasDOMManager
Circle
CircleBrush
ClipPathLayout
Color
Control
Ellipse
FabricImage
FabricObject
FabricText
FitContentLayout
FixedLayout
GLProbe
Gradient
Group
InteractiveFabricObject
Intersection
IText
LayoutManager
LayoutStrategy
Line
Observable
Path
Pattern
PatternBrush
PencilBrush
Point
Polygon
Polyline
Rect
Shadow
SprayBrush
StaticCanvas
StaticCanvasDOMManager
Textbox
Triangle
WebGLFilterBackend
WebGLProbe
fabric
namespaces
controlsUtils
controlsUtils
functions
createObjectDefaultControls
createPathControls
createPolyActionHandler
createPolyControls
createPolyPositionHandler
createResizeControls
createTextboxDefaultControls
factoryPolyActionHandler
getLocalPoint
polyActionHandler
renderCircleControl
renderSquareControl
wrapWithFireEvent
wrapWithFixedAnchor
type-aliases
PathPointControlStyle
variables
changeHeight
changeObjectHeight
changeObjectWidth
changeWidth
rotationStyleHandler
rotationWithSnapping
scaleCursorStyleHandler
scaleOrSkewActionName
scaleSkewCursorStyleHandler
scalingEqually
scalingX
scalingXOrSkewingY
scalingY
scalingYOrSkewingX
skewCursorStyleHandler
skewHandlerX
skewHandlerY
filters
filters
classes
BaseFilter
BlendColor
BlendImage
Blur
Brightness
ColorMatrix
Composed
Contrast
Convolute
Gamma
Grayscale
HueRotation
Invert
Noise
Pixelate
RemoveColor
Resize
Saturation
Vibrance
type-aliases
TBlendMode
TResizeType
variables
BlackWhite
Brownie
Kodachrome
Polaroid
Sepia
Technicolor
Vintage
util
util
functions
addTransformToObject
animate
animateColor
applyTransformToObject
calcAngleBetweenVectors
calcDimensionsMatrix
calcPlaneChangeMatrix
calcVectorRotation
cancelAnimFrame
capValue
composeMatrix
copyCanvasElement
cos
createCanvasElement
createImage
createRotateMatrix
createScaleMatrix
createSkewXMatrix
createSkewYMatrix
createTranslateMatrix
createVector
crossProduct
degreesToRadians
dotProduct
enlivenObjectEnlivables
enlivenObjects
findScaleToCover
findScaleToFit
getBoundsOfCurve
getOrthonormalVector
getPathSegmentsInfo
getPointer
getPointOnPath
getRandomInt
getRegularPolygonPath
getSmoothPathFromPoints
getSvgAttributes
getUnitVector
groupSVGElements
hasStyleChanged
invertTransform
isBetweenVectors
isIdentityMatrix
isTouchEvent
isTransparent
joinPath
loadImage
magnitude
makeBoundingBoxFromPoints
makePathSimpler
matrixToSVG
mergeClipPaths
multiplyTransformMatrices
multiplyTransformMatrixArray
parsePath
parsePreserveAspectRatioAttribute
parseUnit
pick
projectStrokeOnPoints
qrDecompose
radiansToDegrees
removeFromArray
removeTransformFromObject
requestAnimFrame
resetObjectTransform
rotateVector
saveObjectTransform
sendObjectToPlane
sendPointToPlane
sendVectorToPlane
sin
sizeAfterTransform
stylesFromArray
stylesToArray
toBlob
toDataURL
toFixed
transformPath
transformPoint
namespaces
ease
ease
variables
defaultEasing
easeInBack
easeInBounce
easeInCirc
easeInCubic
easeInElastic
easeInExpo
easeInOutBack
easeInOutBounce
easeInOutCirc
easeInOutCubic
easeInOutElastic
easeInOutExpo
easeInOutQuad
easeInOutQuart
easeInOutQuint
easeInOutSine
easeInQuad
easeInQuart
easeInQuint
easeInSine
easeOutBack
easeOutBounce
easeOutCirc
easeOutCubic
easeOutElastic
easeOutExpo
easeOutQuad
easeOutQuart
easeOutQuint
easeOutSine
string
string
functions
capitalize
escapeXml
graphemeSplit
type-aliases
AnimationOptions
AnimationState
ArrayAnimationOptions
ColorAnimationOptions
EnlivenObjectOptions
LoadImageOptions
TAbortCallback
TAnimation
TAnimationBaseOptions
TAnimationCallbacks
TAnimationOptions
TBaseAnimationOptions
TComposeMatrixArgs
TEasingFunction
TextStyleArray
TOnAnimationChangeCallback
TProjection
TProjectStrokeOnPointsOptions
TQrDecomposeOut
TRotateMatrixArgs
TScaleMatrixArgs
TTranslateMatrixArgs
ValueAnimationOptions
functions
createCollectionMixin
getDevicePixelRatio
getEnv
getFabricDocument
getFabricWindow
getFilterBackend
initFilterBackend
isPutImageFaster
isWebGLPipelineState
loadSVGFromString
loadSVGFromURL
parseSVGDocument
setEnv
setEnvFactory
setFilterBackend
interfaces
ActiveSelectionOptions
BasicTransformEvent
CanvasEvents
CanvasOptions
CircleProps
CollectionEvents
DragEventData
DropEventData
EllipseProps
FabricObjectProps
GroupEvents
GroupOwnProps
GroupProps
ImageProps
ITextProps
MiscEvents
ModifiedEvent
ModifyPathEvent
ObjectEvents
PathProps
RectProps
SerializedCircleProps
SerializedEllipseProps
SerializedGroupProps
SerializedImageProps
SerializedITextProps
SerializedLineProps
SerializedObjectProps
SerializedPathProps
SerializedPolylineProps
SerializedRectProps
SerializedTextboxProps
SerializedTextProps
StaticCanvasEvents
StaticCanvasOptions
TEvent
TextboxProps
TextProps
TPointerEventInfo
XY
type-aliases
Abortable
CanvasPointerEvents
CircleBrushPoint
CollectionChangeLayoutContext
ColorStop
CommonLayoutContext
CompleteTextStyleDeclaration
Constructor
ControlActionHandler
ControlCallback
ControlCursorCallback
ControlRenderingStyleOverride
CursorBoundaries
CursorRenderingData
DrawContext
GradientCoords
GradientCoordValue
GradientOptions
GradientType
GradientUnits
GraphemeBBox
GraphemeData
ImageFormat
ImageSource
ImperativeLayoutContext
ImperativeLayoutOptions
InitializationLayoutContext
IntersectionType
ITextEvents
LayoutAfterEvent
LayoutBeforeEvent
LayoutContext
LayoutResult
LayoutStrategyResult
LayoutTrigger
LinearGradientCoords
ModifierKey
MultiSelectionStacking
ObjectModificationEvents
ObjectModifiedLayoutContext
ObjectModifyingLayoutContext
ObjectPointerEvents
PatternOptions
PatternRepeat
Percent
RadialGradientCoords
RegistrationContext
SerializedGradientProps
SerializedLayoutManager
SerializedPatternOptions
SerializedShadowOptions
SprayBrushPoint
StrictLayoutContext
SupportedSVGUnit
SVGElementName
SVGOptions
T2DPipelineState
TArcCommand
TArcCommandSingleFlag
TAxis
TAxisKey
TBBox
TBrushEventData
TCacheCanvasDimensions
TCanvasSizeOptions
TClassProperties
TClosePathCommand
TColorArg
TComplexParsedCommand
TComplexParsedCommandType
TComplexPathData
TCopyPasteData
TCornerPoint
TCrossOrigin
TCubicCurveCommand
TCubicCurveShortcutCommand
TCurveInfo
TDataUrlOptions
TDegree
TEndPathInfo
TEventsExtraData
TextStyle
TextStyleDeclaration
TFabricEnv
TFabricObjectProps
TFabricWindow
TFiller
THorizontalLineCommand
TLineCommand
TMat2D
TMatColorMatrix
TModificationEvents
TMoveToCommand
TOptionalModifierKey
TOptions
TOriginX
TOriginY
TParsedAbsoluteArcCommand
TParsedAbsoluteClosePathCommand
TParsedAbsoluteCubicCurveCommand
TParsedAbsoluteCubicCurveShortcutCommand
TParsedAbsoluteHorizontalLineCommand
TParsedAbsoluteLineCommand
TParsedAbsoluteMoveToCommand
TParsedAbsoluteQuadraticCurveCommand
TParsedAbsoluteQuadraticCurveShortcutCommand
TParsedAbsoluteVerticalLineCommand
TParsedArcCommand
TParsedClosePathCommand
TParsedCommand
TParsedCubicCurveCommand
TParsedCubicCurveShortcutCommand
TParsedHorizontalLineCommand
TParsedLineCommand
TParsedMoveToCommand
TParsedQuadraticCurveCommand
TParsedQuadraticCurveShortcutCommand
TParsedRelativeArcCommand
TParsedRelativeClosePathCommand
TParsedRelativeCubicCurveCommand
TParsedRelativeCubicCurveShortcutCommand
TParsedRelativeHorizontalLineCommand
TParsedRelativeLineCommand
TParsedRelativeMoveToCommand
TParsedRelativeQuadraticCurveCommand
TParsedRelativeQuadraticCurveShortcutCommand
TParsedRelativeVerticalLineCommand
TParsedVerticalLineCommand
TPathAlign
TPathSegmentCommandInfo
TPathSegmentInfo
TPathSegmentInfoCommon
TPathSide
TPipelineResources
TPointAngle
TPointerEvent
TPointerEventNames
TProgramCache
TQuadraticCurveCommand
TQuadraticCurveShortcutCommand
TRadian
Transform
TransformAction
TransformActionHandler
TRectBounds
TRGBAColorSource
TRGBColorSource
TSimpleParseCommandType
TSimpleParsedCommand
TSimplePathData
TSize
TSVGExportOptions
TSVGReviver
TTextureCache
TToCanvasElementOptions
TValidToObjectMethod
TVerticalLineCommand
TWebGLAttributeLocationMap
TWebGLPipelineState
TWebGLProgramCacheItem
TWebGLUniformLocationMap
variables
cache
classRegistry
config
iMatrix
runningAnimations
version
Fabric.js v5
Select theme
Dark
Light
Auto
Brownie
const
Brownie
:
typeof
ColorMatrix
Defined in:
filters/ColorMatrixFilters.ts:30
