SVG cx Attribute Last Updated : 31 Mar, 2022 Improve Improve Like Article Like Save Share Report The cx attribute define the x-axis coordinate of a center point. Syntax: cx="x-centre" Attribute Values: length: Length at which we want to set the cx-coordinate. percentage: Percentage at which we want to set the cx-coordinate. We will use the cx attribute for setting the cx-coordinate. Example 1: <!DOCTYPE html> <html> <body> <svg viewBox="0 0 350 300" xmlns="http://www.w3.org/2000/<svg viewBox="0 0 300 100 xmlns="http://www.w3.org/2000/svg"> <circle cx="50" cy="50" r="45"/> <ellipse cx="150" cy="50" rx="45" ry="25" /> </svg> </body> </html> Output: Example 2: <!DOCTYPE html> <html> <body> <svg viewBox="0 0 350 300" xmlns="http://www.w3.org/2000/<svg viewBox="0 0 300 100 xmlns="http://www.w3.org/2000/svg"> <circle cx="10%" cy="12%" r="9%"/> <ellipse cx="30%" cy="12%" rx="9%" ry="5%" /> </svg> </body> </html> Output: Like Article Suggest improvement Previous SVG by Attribute Next SVG cy Attribute Share your thoughts in the comments Add Your Comment Please Login to comment...