Skip to content

SVG & SMIL elements & attributes used

Tom Byrne edited this page May 5, 2021 · 1 revision

These are the SVG/SMIL elements/attributes used in the output from Flash2Svg. Square brackets refer to common attribute sets and are explained at the bottom.

<svg>
	[common-attributes]​
	[common​-symbol​-attributes]​
	​version = "1.1"
	​xmlns = "http://www.w3.org/2000/svg"
	​xmlns:xlink = "http://www.w3.org/1999/xlink"​
	​image-rendering​ ​=​ ​"auto"​
	baseProfile = "basic"
	style = "background-color: <hex color value>"
	enable-background = "new 0 0 [length] [length]"

<animateTransform>
	[common-animation-attributes]
	attributeName = "transform"
	additive = "replace" | "sum"
	type = "translate" | "rotate" | "scale" | "skewX" | "skewY"

<animate>
	[common-animation-attributes]
	attributeName = "display" | "opacity" | "intercept" | "slope" (last two used inside animated feComponentTransfer nodes, shouldn't encounter unless animated color transforms have been used)


<use>
	[common-attributes]
	xlink:href = <xlink to symbol in refs>

<g>
	[common-attributes]
	mask = <xlink to symbol in refs>

<mask>
	[common-attributes]

<defs> - Used as invisible container for symbols and filters

<symbol>
	[common-attributes]
	[common-symbol-attributes]

<path>
	[common-attributes]
	fill = <hex color value> | "none" | <xlink to gradient, e.g. url(#linearGradient)>
	d = <path information, e.g. "M373,300L373,0 0,0 0,300 373,300">
	stroke = <hex color value>
	stroke-width = [length]
	stroke-linecap = "round" | "miter" | "square"
	stroke-linejoin =  "round" | "miter" | "bevel"
	stroke-miterlimit = [length]
	vector-effect = "non-scaling-stroke"
	mask = <xlink to symbol in refs>

<radialGradient>
	id = [id]
	gradientUnits = "userSpaceOnUse"
	color-interpolation = "sRGB"
	r = [length]
	cx = [length]
	cy = [length]
	fx = [length]
	fy = [length]
	gradientTransform = <geom transform for gradient e.g. "matrix(-0.36 -0.933 -0.527 0.204 141.65 128.45)">

<linearGradient>
	id = [id]
	gradientUnits = "userSpaceOnUse"
	color-interpolation="sRGB"
	x1 = [length]
	x2 = [length]
	y1 = [length]
	y2 = [length]

<stop> - Used inside gradient nodes to describe gradient colors
	stop-color = <hex color value>
	stop-opacity = <opacity value>
	offset = <float between 0 and 1>

<filter> - Used as a filter stack for filters and color transforms
	id = [id]
	filterUnits = "objectBoundingBox"
	width = "100%"
	height = "100%"
	x = "0%"
	y = "0%"

<feColorMatrix> - This is used for non-animated color transforms (as well as Adjust Color filters)
	type = "matrix"
	in = "SourceGraphic" | <the 'result' attr. of another filter node if filters have been used>
	result = "colorTrans"
	values = <a color matrix, e.g. "0.24 0 0 0 0.514 0 0.43 0 0 0.118 0 0 1 0 0 0 0 0 1 0">

<feComponentTransfer>
	This shouldn't exist unless filters have been used (Adjust color or glow filters) or there is an animated color transform, let me know if you want more info

<feGaussianBlur>
	This shouldn't exist unless a blur filter has been used, let me know if you want more info

<feMerge>
	This shouldn't exist unless a glow filter has been used, let me know if you want more info

<image>
	These shouldn't be used in your animations (it saves the bitmaps in external files and references them).

[common-attributes]
	id
	[id]
	display = inline | none=
	filter = <xlink to filter node in refs>
	transform = <matrix, e.g. matrix(1 0 0 1 81 116)>

width
	[length]

height
	[length]

x
	[length]

y
	[length]

[common-animation-attributes]
	dur = [timespec]
	repeatDur = [timespec]
	repeatCount = [float] | indefinite (loops forever)
	calcMode = spline | linear |	discrete (no frame interpolation, no keyTimes or keySplines attr. will be included)
	keyTimes = <list of fractional values between 0 and 1>
	keySplines = <list of splines, each being a series of four numbers>
	values = <list of destination values for each keyframe>
	fill = "freeze" (used for non-looping animations to hold them in place after completion)


[common-symbol-attributes]
	overflow = visible

[timespec]
	<float>s

[length]
	<float> (only ever generates px values, without the 'px' suffix, as SVG allows)

[id]
	<alpha numeric inc. underscore>
Clone this wiki locally