W3cubDocs

/SVG

<style>

The <style> SVG element allows style sheets to be embedded directly within SVG content. SVG's style element has the same attributes as the corresponding element in HTML (see HTML's <style> element).

Usage context

Categories None
Permitted content Any elements or character data

Attributes

Global attributes

Specific attributes

DOM Interface

This element implements the SVGStyleElement interface.

Example

SVG

<svg width="150" height="150" viewBox="0 0 100 100"
     xmlns="http://www.w3.org/2000/svg">
  <style>
    /* <![CDATA[ */
    circle {
      fill: orange;
      stroke: black;
      stroke-width: 10px; /* Note: The value of a pixel depends
                             on the view box */
    }
    /* ]]> */
  </style>

  <circle cx="50" cy="50" r="40" />
</svg>

Result

Specifications

Browser compatibilityUpdate compatibility data on GitHub

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
Basic support 1 Yes 1.5 9 9 3.1
type ? ? ? ? ? ?
media ? ? ? ? ? ?
title ? ? ? ? ? ?
Mobile
Android webview Chrome for Android Edge Mobile Firefox for Android Opera for Android iOS Safari Samsung Internet
Basic support 3 18 Yes 4 Yes 3.1 ?
type ? ? ? ? ? ? ?
media ? ? ? ? ? ? ?
title ? ? ? ? ? ? ?

See also

© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Element/style