You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "When MPEG-1 Audio Layer III codec data is stored in an MPEG file, and there is no video track on the file, the file is typically referred to as an MP3 file, even though it's still an MPEG format file."
tr (78:3) => tableRow
type: "html"
value: "<th scope=\"row\"><a href=\"#mp3_mpeg-1_audio_layer_iii\">MP3</a></th>",type: "html"
value: "<td><a href=\"/en-US/docs/Web/Media/Formats/Containers#mp4\">MP4</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#adts\">ADTS</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#mpeg\">MPEG</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#3gp\">3GP</a><p>When MPEG-1 Audio Layer III codec data is stored in an MPEG file, and there is no video track on the file, the file is typically referred to as an MP3 file, even though it's still an MPEG format file.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Feature</th><th scope=\"col\">Effect on quality</th><th scope=\"col\">Effect on size</th></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#Audio_data_format_and_structure\">Channel count</a></th><td>The number of channels affects only the perception of directionality, not the quality.</td><td>Each channel may substantially increase the encoded audio size, depending on contents and encoder settings.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Noise / Hiss</th><td>Unwanted background noise or hiss tends to reduce audio quality both directly (by masking details of the foreground audio) and indirectly (by making the audio waveform more complicated and therefore difficult to reduce in size while maintaining precision).</td><td>Hiss, static, or background noise increases the audio complexity, which generally reduces the amount of compression which is possible.</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#Sampling_audio\">Sample rate</a></th><td>The more samples available per second, the higher the resulting encoded audio fidelity is likely to be.</td><td>Increasing the sample rate increases the encoded audio file's size.</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#Audio_data_format_and_structure\">Sample size</a></th><td>The larger the samples, the more detail each sample can contain, resulting in more accurate representation of each sample.</td><td>Depends on the codec; codecs typically have an internal sample format that may or may not be the same as the original sample size. But more source detail may make the encoded file larger; it will never make it smaller.</td></tr>"
type: "html"
value: "<tr><th scope=\"row\">Feature</th><th scope=\"col\">Effect on quality</th><th scope=\"col\">Effect on size</th></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#lossy_vs_lossless_compression\">Lossless compression</a></th><td>No loss of fidelity</td><td>Unlikely to get more than 40-50% compression</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#lossy_vs_lossless_compression\">Lossy compression</a></th><td>Always some loss of fidelity; the higher the compression, the more the loss</td><td>Compression of up to 80-95% possible</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#quality\">Quality setting</a></th><td>The higher the quality, the better the fidelity of the encoded audio</td><td>The higher the fidelity, the larger the resulting file becomes, though the amount of change varies from codec to codec</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#bit_rate\">Bit rate</a></th><td>The higher the bit rate, the higher the quality can be</td><td>The higher the bit rate, the larger the encoded file is likely to be</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#audio_frequency_bandwidth\">Audio frequency bandwidth</a></th><td>If there is any audio in the removed frequency band(s), there may be a noticeable loss of fidelity</td><td>Removing frequency bands means less data to encode, thus smaller encoded files</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#stereo_coding_method\">Stereo coding</a></th><td>Simple stereo and <a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#mid-side_stereo_coding\">mid-side stereo coding</a> don't affect quality; <a href=\"/en-US/docs/Web/Media/Formats/Audio_concepts#intensity_stereo_coding\">intensity stereo coding</a> introduces loss of detail, however.</td><td>Joint stereo can reduce the size of the encoded audio to some extent</td></tr>"
tr (237:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>Arbitrary, up to 512 kbps</td>"
tr (241:3) => tableRow
type: "html"
value: "<th scope=\"row\">Variable Bit Rate (VBR) support</th>"
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "text"
value: "Due to patent issues, Firefox does not directly support AAC. Instead, Firefox relies upon a platform's native support for AAC. This capability was introduced on each platform in different Firefox releases:",type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "text"
value: "Chrome supports AAC only in MP4 containers, and only supports AAC's Main Profile. In addition, AAC is not available in Chromium builds."
tr (274:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">AAC support</th><td>Yes</td><td>Yes</td><td>Yes</td><td>9</td><td>Yes</td><td>3.1</td></tr></tbody></table><p>Due to patent issues, Firefox does not directly support AAC. Instead, Firefox relies upon a platform's native support for AAC. This capability was introduced on each platform in different Firefox releases:</p><p>Chrome supports AAC only in MP4 containers, and only supports AAC's Main Profile. In addition, AAC is not available in Chromium builds.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td>Arbitrary, up to 512 kbps</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Bit Rate (VBR) support</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported sample formats</th><td>32-bit integer</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported sample rates</th><td>8 kHz - 96 kHz</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Recommended minimum bit rate for stereo sound</th><td>96 kbps at 48 kHz sample rate</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum audio channels</th><td>48 (plus 16 Low Frequency Enhancement channels)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Audio frequency bandwidth</th><td>0 Hz - 96 kHz (standard audio channels)<br>0 Hz - 120 Hz (LFE channels)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Latency</th><td>20 ms to 405 ms</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">AAC support</th><td>Yes</td><td>Yes</td><td>Yes</td><td>9</td><td>Yes</td><td>3.1</td></tr></tbody></table><p>Due to patent issues, Firefox does not directly support AAC. Instead, Firefox relies upon a platform's native support for AAC. This capability was introduced on each platform in different Firefox releases:</p><p>Chrome supports AAC only in MP4 containers, and only supports AAC's Main Profile. In addition, AAC is not available in Chromium builds.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td>MP4, ADTS, 3GP</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>For streaming or distributing AAC-encoded content: no license required; developers of codecs are required to obtain a patent license through <a href=\"https://www.via-corp.com/licensing/aac/\">VIA Licensing</a></td></tr>"
tr (357:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>Based on the sample format and sample rate, as well as the compression level</td>"
tr (361:3) => tableRow
type: "html"
value: "<th scope=\"row\">Variable Bit Rate (VBR) support</th>"
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 10
shouldWrap: true
children:
type: "text"
value: "While the Chrome browser does not support AMR, Chrome OS supports AMR-NB (narrowband) and AMR-WB (wideband)."
tr (484:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">AMR support</th><td>No</td><td>?</td><td>No</td><td>?</td><td>No</td><td>?</td></tr></tbody></table><p>While the Chrome browser does not support AMR, Chrome OS supports AMR-NB (narrowband) and AMR-WB (wideband).</p></td>"
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "text"
value: "G.711 is supported only for WebRTC connections."
tr (660:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">G.711 support</th><td>23</td><td>15</td><td>22</td><td>No</td><td>43</td><td>11</td></tr></tbody></table><p>G.711 is supported only for WebRTC connections.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td>64 kbps</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Bit Rate (VBR) support</th><td>No</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported sample formats</th><td>encoded audio is 8 bits per sample</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported sample rates</th><td>8 kHz</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Recommended minimum bit rate for stereo sound</th><td>128 kbps</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Logarithmic companding (µ-law or A-law)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum audio channels</th><td>2</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Audio frequency bandwidth</th><td>300 Hz – 3400 Hz</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Latency</th><td>0.125 ms</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">G.711 support</th><td>23</td><td>15</td><td>22</td><td>No</td><td>43</td><td>11</td></tr></tbody></table><p>G.711 is supported only for WebRTC connections.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td>3GP, WAV</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>All applicable patents have expired, so G.711 is free to use without restriction</td></tr>"
tr (713:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>G.722: 48 kbps, 56 kbps, and 64 kbps; however, in practice 64 kbps is always used<br>G.722 Annex B Super Wide-Band: 64 kbps, 80 kbps, and 96 kbps<br>G.722 Annex D Stereo Wide-Band: 64 kbps and 80 kbps<br>G.722 Annex D Stereo Super Wide-Band: 80 kbps, 96 kbps, 112 kbps, and 128 kbps</td>"
tr (720:3) => tableRow
type: "html"
value: "<th scope=\"row\">Variable Bit Rate (VBR) support</th>"
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "text"
value: "WebRTC only."
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "text"
value: "The specified sample rates are "
type: "emphasis"
children:
type: "text"
value: "effective sample rates"
type: "text"
value: ". Opus uses an algorithm based on audio bandwidths rather than sample rates. See {{UkZDKDY3MTYsICIiLCAyKQ==}} for details. In addition, there is an "
type: "emphasis"
children:
type: "text"
value: "optional"
type: "text"
value: " part of the Opus specification (Opus Custom) that does allow for non-standard sample rates, but the use of this feature is discouraged."
tr (947:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported sample rates</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Profile</th><th scope=\"col\">Effective sample rate</th></tr><tr><th scope=\"row\">Narrowband (NB)</th><td>8 kHz</td></tr><tr><th scope=\"row\">Medium band (MB)</th><td>12 kHz</td></tr><tr><th scope=\"row\">Wideband (WB)</th><td>16 kHz</td></tr><tr><th scope=\"row\">Super Wideband (SWB)</th><td>24 kHz</td></tr><tr><th scope=\"row\">Fullband (FB)</th><td>48 kHz</td></tr></tbody></table><p>The specified sample rates are <em>effective sample rates</em>. Opus uses an algorithm based on audio bandwidths rather than sample rates. See {{UkZDKDY3MTYsICIiLCAyKQ==}} for details. In addition, there is an <em>optional</em> part of the Opus specification (Opus Custom) that does allow for non-standard sample rates, but the use of this feature is discouraged.</p></td>"
tr (981:3) => tableRow
type: "html"
value: "<th scope=\"row\">Recommended minimum bit rate for stereo sound</th>"
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Although the {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiTnlxdWlzdOKAk1NoYW5ub24gc2FtcGxpbmcgdGhlb3JlbSIp}} shows that audio bandwidth can be as much as one half of the sampling rate, Opus doesn't allow encoding outside a maximum 20 kHz audio frequency band, since the human ear can't percieve anything above the 20 kHz point anyway. This saves some space in the encoded audio."
tr (993:3) => tableRow
type: "html"
value: "<th scope=\"row\">Audio frequency bandwidth</th>",type: "html"
value: "<td><table class=\"standard-table\"><thead><tr><th scope=\"row\">Profile</th><th scope=\"col\">Audio bandwidth</th></tr></thead><tbody><tr><th scope=\"row\">Narrowband (NB)</th><td>4 kHz</td></tr><tr><th scope=\"row\">Medium band (MB)</th><td>6 kHz</td></tr><tr><th scope=\"row\">Wideband (WB)</th><td>8 kHz</td></tr><tr><th scope=\"row\">Super Wideband (SWB)</th><td>12 kHz</td></tr><tr><th scope=\"row\">Fullband (FB)</th><td>20 kHz</td></tr></tbody></table><p>Although the {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiTnlxdWlzdOKAk1NoYW5ub24gc2FtcGxpbmcgdGhlb3JlbSIp}} shows that audio bandwidth can be as much as one half of the sampling rate, Opus doesn't allow encoding outside a maximum 20 kHz audio frequency band, since the human ear can't percieve anything above the 20 kHz point anyway. This saves some space in the encoded audio.</p></td>"
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "text"
value: "This information refers to support for Opus in HTML {{SFRNTEVsZW1lbnQoImF1ZGlvIik=}} and {{SFRNTEVsZW1lbnQoInZpZGVvIik=}} elements, and not to WebRTC.",type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "text"
value: "Safari supports Opus in the {{SFRNTEVsZW1lbnQoImF1ZGlvIik=}} element only when packaged in a CAF file, and only on macOS High Sierra (10.13) or iOS 11."
tr (1033:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">Opus support</th><td>33</td><td>14</td><td>15</td><td>No</td><td>20</td><td>11</td></tr></tbody></table><p>This information refers to support for Opus in HTML {{SFRNTEVsZW1lbnQoImF1ZGlvIik=}} and {{SFRNTEVsZW1lbnQoInZpZGVvIik=}} elements, and not to WebRTC.</p><p>Safari supports Opus in the {{SFRNTEVsZW1lbnQoImF1ZGlvIik=}} element only when packaged in a CAF file, and only on macOS High Sierra (10.13) or iOS 11.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td>6 kbps - 510 kbps</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Bit Rate (VBR) support</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported sample formats</th><td>16-bit integer and 32-bit float (-1.0 to 1.0)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported sample rates</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Profile</th><th scope=\"col\">Effective sample rate</th></tr><tr><th scope=\"row\">Narrowband (NB)</th><td>8 kHz</td></tr><tr><th scope=\"row\">Medium band (MB)</th><td>12 kHz</td></tr><tr><th scope=\"row\">Wideband (WB)</th><td>16 kHz</td></tr><tr><th scope=\"row\">Super Wideband (SWB)</th><td>24 kHz</td></tr><tr><th scope=\"row\">Fullband (FB)</th><td>48 kHz</td></tr></tbody></table><p>The specified sample rates are <em>effective sample rates</em>. Opus uses an algorithm based on audio bandwidths rather than sample rates. See {{UkZDKDY3MTYsICIiLCAyKQ==}} for details. In addition, there is an <em>optional</em> part of the Opus specification (Opus Custom) that does allow for non-standard sample rates, but the use of this feature is discouraged.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Recommended minimum bit rate for stereo sound</th><td>96 kbps at 48 kHz sample rate</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum audio channels</th><td>255 (up to 1 LFE channel)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Audio frequency bandwidth</th><td><table class=\"standard-table\"><thead><tr><th scope=\"row\">Profile</th><th scope=\"col\">Audio bandwidth</th></tr></thead><tbody><tr><th scope=\"row\">Narrowband (NB)</th><td>4 kHz</td></tr><tr><th scope=\"row\">Medium band (MB)</th><td>6 kHz</td></tr><tr><th scope=\"row\">Wideband (WB)</th><td>8 kHz</td></tr><tr><th scope=\"row\">Super Wideband (SWB)</th><td>12 kHz</td></tr><tr><th scope=\"row\">Fullband (FB)</th><td>20 kHz</td></tr></tbody></table><p>Although the {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiTnlxdWlzdOKAk1NoYW5ub24gc2FtcGxpbmcgdGhlb3JlbSIp}} shows that audio bandwidth can be as much as one half of the sampling rate, Opus doesn't allow encoding outside a maximum 20 kHz audio frequency band, since the human ear can't percieve anything above the 20 kHz point anyway. This saves some space in the encoded audio.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Latency</th><td>5 ms to 66.5 ms</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">Opus support</th><td>33</td><td>14</td><td>15</td><td>No</td><td>20</td><td>11</td></tr></tbody></table><p>This information refers to support for Opus in HTML {{SFRNTEVsZW1lbnQoImF1ZGlvIik=}} and {{SFRNTEVsZW1lbnQoInZpZGVvIik=}} elements, and not to WebRTC.</p><p>Safari supports Opus in the {{SFRNTEVsZW1lbnQoImF1ZGlvIik=}} element only when packaged in a CAF file, and only on macOS High Sierra (10.13) or iOS 11.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td>Ogg, WebM, MPEG-TS, MP4</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Fully open and free of any licensing requirements</td></tr>"
type: "paragraph"
summary: "In this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "text"
value: "This information refers to support for Vorbis in HTML {{SFRNTEVsZW1lbnQoImF1ZGlvIik=}} and {{SFRNTEVsZW1lbnQoInZpZGVvIik=}} elements, and not to WebRTC."
tr (1122:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">Vorbis support</th><td>4</td><td>17</td><td>3.5</td><td>No</td><td>11.5</td><td>No</td></tr></tbody></table><p>This information refers to support for Vorbis in HTML {{SFRNTEVsZW1lbnQoImF1ZGlvIik=}} and {{SFRNTEVsZW1lbnQoInZpZGVvIik=}} elements, and not to WebRTC.</p></td>"
type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "text"
value: "The one-digit profile number:",type: "table"
children:
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 0
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Profile number"
type: "tableCell"
children:
type: "text"
value: "Description"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "0"
type: "tableCell"
children:
type: "text"
value: "\"Main\" profile; supports YUV 4:2:0 or monochrome bitstreams with bit depth of 8 or 10 bits per component."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "1"
type: "tableCell"
children:
type: "text"
value: "\"High\" profile adds support for 4:4:4 chroma subsampling."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "2"
type: "tableCell"
children:
type: "text"
value: "\"Professional\" profile adds support for 4:2:2 chroma subsampling and 12 bit per component color."
tr (93:3) => tableRow
type: "html"
value: "<td><p>The one-digit profile number:</p><table class=\"standard-table\"><caption>AV1 profile numbers</caption><thead><tr><th scope=\"col\">Profile number</th><th scope=\"col\">Description</th></tr></thead><tbody><tr><td>0</td><td>\"Main\" profile; supports YUV 4:2:0 or monochrome bitstreams with bit depth of 8 or 10 bits per component.</td></tr><tr><td>1</td><td>\"High\" profile adds support for 4:4:4 chroma subsampling.</td></tr><tr><td>2</td><td>\"Professional\" profile adds support for 4:2:2 chroma subsampling and 12 bit per component color.</td></tr></tbody></table></td>"
td (141:4) => tableCell
type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "inlineCode"
value: "CCC"
type: "text"
value: " indicates the chroma subsampling as three digits. The first digit is "
type: "inlineCode"
value: "subsampling_x"
type: "text"
value: ", the second is "
type: "inlineCode"
value: "subsampling_y"
type: "text"
value: ". If both of those are 1, the third is the value of "
type: "inlineCode"
value: "chroma_sample_position"
type: "text"
value: "; otherwise, the third digit is always 0. This, combined with the "
type: "inlineCode"
value: "M"
type: "text"
value: " component, can be used to construct the chroma subsampling format:",type: "table"
children:
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 0
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "subsampling_x"
type: "tableCell"
children:
type: "text"
value: "subsampling_y"
type: "tableCell"
children:
type: "text"
value: "Monochrome flag"
type: "tableCell"
children:
type: "text"
value: "Chroma subsampling format"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "0"
type: "tableCell"
children:
type: "text"
value: "0"
type: "tableCell"
children:
type: "text"
value: "0"
type: "tableCell"
children:
type: "text"
value: "YUV 4:4:4"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "1"
type: "tableCell"
children:
type: "text"
value: "0"
type: "tableCell"
children:
type: "text"
value: "0"
type: "tableCell"
children:
type: "text"
value: "YUV 4:2:2"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "1"
type: "tableCell"
children:
type: "text"
value: "1"
type: "tableCell"
children:
type: "text"
value: "0"
type: "tableCell"
children:
type: "text"
value: "YUV 4:2:0"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "1"
type: "tableCell"
children:
type: "text"
value: "1"
type: "tableCell"
children:
type: "text"
value: "1"
type: "tableCell"
children:
type: "text"
value: "YUV 4:0:0 (Monochrome)",type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "text"
value: "The third digit in "
type: "inlineCode"
value: "CCC"
type: "text"
value: " indicates the chroma sample position, with a value of 0 indicating that the position is unknown and must be separately provided during decoding; a value of 1 indicating that the sample position is horizontally colocated with the (0, 0) luma sample; and a value of 2 indicating that the sample position is colocated with (0, 0) luma.",type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "text"
value: "The default value is "
type: "inlineCode"
value: "110"
type: "text"
value: " (4:2:0 chroma subsampling)."
tr (139:3) => tableRow
type: "html"
value: "<td><p><code>CCC</code> indicates the chroma subsampling as three digits. The first digit is <code>subsampling_x</code>, the second is <code>subsampling_y</code>. If both of those are 1, the third is the value of <code>chroma_sample_position</code>; otherwise, the third digit is always 0. This, combined with the <code>M</code> component, can be used to construct the chroma subsampling format:</p><table class=\"standard-table\"><caption>Determining the chroma subsampling format</caption><thead><tr><th scope=\"col\">subsampling_x</th><th scope=\"col\">subsampling_y</th><th scope=\"col\">Monochrome flag</th><th scope=\"col\">Chroma subsampling format</th></tr></thead><tbody><tr><td>0</td><td>0</td><td>0</td><td>YUV 4:4:4</td></tr><tr><td>1</td><td>0</td><td>0</td><td>YUV 4:2:2</td></tr><tr><td>1</td><td>1</td><td>0</td><td>YUV 4:2:0</td></tr><tr><td>1</td><td>1</td><td>1</td><td>YUV 4:0:0 (Monochrome)</td></tr></tbody></table><p>The third digit in <code>CCC</code> indicates the chroma sample position, with a value of 0 indicating that the position is unknown and must be separately provided during decoding; a value of 1 indicating that the sample position is horizontally colocated with the (0, 0) luma sample; and a value of 2 indicating that the sample position is colocated with (0, 0) luma.</p><p>The default value is <code>110</code> (4:2:0 chroma subsampling).</p></td>"
table.standard-table (84:1) => table
type: "html"
value: "<tr><td><code>P</code></td><td><p>The one-digit profile number:</p><table class=\"standard-table\"><caption>AV1 profile numbers</caption><thead><tr><th scope=\"col\">Profile number</th><th scope=\"col\">Description</th></tr></thead><tbody><tr><td>0</td><td>\"Main\" profile; supports YUV 4:2:0 or monochrome bitstreams with bit depth of 8 or 10 bits per component.</td></tr><tr><td>1</td><td>\"High\" profile adds support for 4:4:4 chroma subsampling.</td></tr><tr><td>2</td><td>\"Professional\" profile adds support for 4:2:2 chroma subsampling and 12 bit per component color.</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><td><code>CCC</code></td><td><p><code>CCC</code> indicates the chroma subsampling as three digits. The first digit is <code>subsampling_x</code>, the second is <code>subsampling_y</code>. If both of those are 1, the third is the value of <code>chroma_sample_position</code>; otherwise, the third digit is always 0. This, combined with the <code>M</code> component, can be used to construct the chroma subsampling format:</p><table class=\"standard-table\"><caption>Determining the chroma subsampling format</caption><thead><tr><th scope=\"col\">subsampling_x</th><th scope=\"col\">subsampling_y</th><th scope=\"col\">Monochrome flag</th><th scope=\"col\">Chroma subsampling format</th></tr></thead><tbody><tr><td>0</td><td>0</td><td>0</td><td>YUV 4:4:4</td></tr><tr><td>1</td><td>0</td><td>0</td><td>YUV 4:2:2</td></tr><tr><td>1</td><td>1</td><td>0</td><td>YUV 4:2:0</td></tr><tr><td>1</td><td>1</td><td>1</td><td>YUV 4:0:0 (Monochrome)</td></tr></tbody></table><p>The third digit in <code>CCC</code> indicates the chroma sample position, with a value of 0 indicating that the position is unknown and must be separately provided during decoding; a value of 1 indicating that the sample position is horizontally colocated with the (0, 0) luma sample; and a value of 2 indicating that the sample position is colocated with (0, 0) luma.</p><p>The default value is <code>110</code> (4:2:0 chroma subsampling).</p></td></tr>"
td (671:4) => tableCell
type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 43
shouldWrap: true
children:
type: "text"
value: "SAOC (Spatial Audio Object Coding)",type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 43
shouldWrap: true
children:
type: "text"
value: "Defined in "
type: "link"
title:
url: "https://www.iso.org/standard/54838.html"
children:
type: "text"
value: "ISO/IEC 14496-3:2009/Amd.2:2010(E)"
type: "text"
value: "."
type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 44
shouldWrap: true
children:
type: "text"
value: "LD MPEG Surround (Low Delay MPEG Surround)",type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 44
shouldWrap: true
children:
type: "text"
value: "Defined in "
type: "link"
title:
url: "https://www.iso.org/standard/54838.html"
children:
type: "text"
value: "ISO/IEC 14496-3:2009/Amd.2:2010(E)"
type: "text"
value: "."
type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "text"
value: "A four-character code indicating which indicates which of the possible codecs is being described. Potential values are:",type: "table"
children:
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 0
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Four-character code"
type: "tableCell"
children:
type: "text"
value: "Codec"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "vp08"
type: "tableCell"
children:
type: "text"
value: "VP8"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "vp09"
type: "tableCell"
children:
type: "text"
value: "VP9"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "vp10"
type: "tableCell"
children:
type: "text"
value: "VP10"
tr (753:3) => tableRow
type: "html"
value: "<td><p>A four-character code indicating which indicates which of the possible codecs is being described. Potential values are:</p><table class=\"standard-table\"><caption>Four-character codes for WebM-supported codecs</caption><thead><tr><th scope=\"col\">Four-character code</th><th scope=\"col\">Codec</th></tr></thead><tbody><tr><td><code>vp08</code></td><td>VP8</td></tr><tr><td><code>vp09</code></td><td>VP9</td></tr><tr><td><code>vp10</code></td><td>VP10</td></tr></tbody></table></td>"
td (785:4) => tableCell
type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "The two-digit profile number, padded with leading zeroes if necessary to be exactly two digits.",type: "table"
children:
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 0
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Profile"
type: "tableCell"
children:
type: "text"
value: "Description"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "00"
type: "tableCell"
children:
type: "text"
value: "Only 4:2:0 (chroma subsampled both horizontally and vertically). Allows only 8 bits per color component."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "01"
type: "tableCell"
children:
type: "text"
value: "All chroma subsampling formats are allowed. Allows only 8 bits per color component."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "02"
type: "tableCell"
children:
type: "text"
value: "Only 4:2:0 (chroma subsampled both horizontally and vertically). Supports 8, 10, or 12 bits per color sample component."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "03"
type: "tableCell"
children:
type: "text"
value: "All chroma subsampling formats are allowed. Supports 8, 10, or 12 bits per color sample component."
tr (783:3) => tableRow
type: "html"
value: "<td><p>The two-digit profile number, padded with leading zeroes if necessary to be exactly two digits.</p><table class=\"standard-table\"><caption>WebM profile numbers</caption><thead><tr><th scope=\"col\">Profile</th><th scope=\"col\">Description</th></tr></thead><tbody><tr><td><code>00</code></td><td>Only 4:2:0 (chroma subsampled both horizontally and vertically). Allows only 8 bits per color component.</td></tr><tr><td><code>01</code></td><td>All chroma subsampling formats are allowed. Allows only 8 bits per color component.</td></tr><tr><td><code>02</code></td><td>Only 4:2:0 (chroma subsampled both horizontally and vertically). Supports 8, 10, or 12 bits per color sample component.</td></tr><tr><td><code>03</code></td><td>All chroma subsampling formats are allowed. Supports 8, 10, or 12 bits per color sample component.</td></tr></tbody></table></td>"
td (827:4) => tableCell
type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 5
shouldWrap: true
children:
type: "text"
value: "A two-digit value indicating which chroma subsampling format to use. The following table lists permitted values; see {{U2VjdGlvbk9uUGFnZSgiZW4tVVMvZG9jcy9XZWIvTWVkaWEvRm9ybWF0cy9WaWRlb19jb25jZXB0cyIsICJDaHJvbWEgc3Vic2FtcGxpbmciKQ==}} for additional information about this topic and others.",type: "table"
children:
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 0
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Value"
type: "tableCell"
children:
type: "text"
value: "Chroma subsampling format"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "00"
type: "tableCell"
children:
type: "text"
value: "4:2:0 with the chroma samples sited interstitially between the pixels"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "01"
type: "tableCell"
children:
type: "text"
value: "4:2:0 chroma subsampling with the samples colocated with luma (0, 0)"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "02"
type: "tableCell"
children:
type: "text"
value: "4:2:2 chroma subsampling (4 out of each 4 horizontal pixels' luminance are used)"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "03"
type: "tableCell"
children:
type: "text"
value: "4:4:4 chroma subsampling (every pixel's luminance and chrominance are both retained)"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 5
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "04"
type: "tableCell"
children:
type: "emphasis"
children:
type: "text"
value: "Reserved"
tr (825:3) => tableRow
type: "html"
value: "<td><p>A two-digit value indicating which chroma subsampling format to use. The following table lists permitted values; see {{U2VjdGlvbk9uUGFnZSgiZW4tVVMvZG9jcy9XZWIvTWVkaWEvRm9ybWF0cy9WaWRlb19jb25jZXB0cyIsICJDaHJvbWEgc3Vic2FtcGxpbmciKQ==}} for additional information about this topic and others.</p><table class=\"standard-table\"><caption>WebM chroma subsampling identifiers</caption><thead><tr><th scope=\"col\">Value</th><th scope=\"col\">Chroma subsampling format</th></tr></thead><tbody><tr><td><code>00</code></td><td>4:2:0 with the chroma samples sited interstitially between the pixels</td></tr><tr><td><code>01</code></td><td>4:2:0 chroma subsampling with the samples colocated with luma (0, 0)</td></tr><tr><td><code>02</code></td><td>4:2:2 chroma subsampling (4 out of each 4 horizontal pixels' luminance are used)</td></tr><tr><td><code>03</code></td><td>4:4:4 chroma subsampling (every pixel's luminance and chrominance are both retained)</td></tr><tr><td><code>04</code></td><td><em>Reserved</em></td></tr></tbody></table></td>"
td (865:4) => tableCell
type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "text"
value: "A two-digit integer specifying which of the color primaries from Section 8.1 of the "
type: "link"
title:
url: "https://www.itu.int/rec/T-REC-H.273/en"
children:
type: "text"
value: "ISO/IEC 23001-8:2016"
type: "text"
value: " standard. This component, and every component after it, is optional.",type: "paragraph"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "text"
value: "The possible values of the color primaries component are:",type: "table"
children:
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 0
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Value"
type: "tableCell"
children:
type: "text"
value: "Details"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "00"
type: "tableCell"
children:
type: "emphasis"
children:
type: "text"
value: "Reserved for future use by ITU or ISO/IEC"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "01"
type: "tableCell"
children:
type: "text"
value: "BT.709, sRGB, sYCC. BT.709 is the standard for high definition (HD) television; sRGB is the most common color space used for computer displays. Broadcast BT.709 uses 8-bit color depth with the legal range being from 16 (black) to 235 (white)."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "02"
type: "tableCell"
children:
type: "text"
value: "Image characteristics are unknown, or are to be determined by the application"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "03"
type: "tableCell"
children:
type: "emphasis"
children:
type: "text"
value: "Reserved for future use by ITU or ISO/IEC"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 5
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "04"
type: "tableCell"
children:
type: "text"
value: "BT.470 System M, NTSC (standard definition television in the United States)"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "05"
type: "tableCell"
children:
type: "text"
value: "BT.470 System B, G; BT.601; BT.1358 625; BT.1700 625 PAL and 625 SECAM"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "06"
type: "tableCell"
children:
type: "text"
value: "BT.601 525; BT.1358 525 or 625; BT.1700 NTSC; SMPTE 170M. "
type: "emphasis"
children:
type: "text"
value: "Functionally identical to "
type: "inlineCode"
value: "7"
type: "text"
value: "."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 8
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "70"
type: "tableCell"
children:
type: "text"
value: "{{R2xvc3NhcnkoIlNNUFRFIik=}} 240M (historical). "
type: "emphasis"
children:
type: "text"
value: "Functionally identical to "
type: "inlineCode"
value: "6"
type: "text"
value: "."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "08"
type: "tableCell"
children:
type: "text"
value: "Generic film"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 10
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "09"
type: "tableCell"
children:
type: "text"
value: "BT.2020; BT.2100. Used for ultra-high definition (4K) High Dynamic Range (HDR) video, these have a very wide color gamut and support 10-bit and 12-bit color component depths."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 11
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "10"
type: "tableCell"
children:
type: "text"
value: "SMPTE ST 428 (D-Cinema Distribution Master: Image characteristics). Defines the uncompressed image characteristics for DCDM."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 12
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "11"
type: "tableCell"
children:
type: "text"
value: "SMPTE RP 431 (D-Cinema Quality: Reference projector and environment). Describes the reference projector and environment conditions that provide a consistent film presentation experience."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 13
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "12"
type: "tableCell"
children:
type: "text"
value: "SMPTE EG 432 (Digital Source Processing: Color Processing for D-Cinema). Engineering guideline making color signal decoding recommendations for digital movies."
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 14
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "13"
type: "text"
value: " – "
type: "inlineCode"
value: "21"
type: "tableCell"
children:
type: "emphasis"
children:
type: "text"
value: "Reserved for future use by ITU-T or ISO/IEC"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 15
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "22"
type: "tableCell"
children:
type: "text"
value: "EBU Tech 3213-E"
type: "tableRow"
summary: "This guide briefly examines the syntax of the media type codecs parameter and how it's used with the MIME type string to provide details about the contents of audio or video media beyond indicating the container type."
locale: "en-US"
rowIndex: 16
shouldWrap: true
children:
type: "tableCell"
children:
type: "inlineCode"
value: "23"
type: "text"
value: " – "
type: "inlineCode"
value: "255"
type: "tableCell"
children:
type: "emphasis"
children:
type: "text"
value: "Reserved for future use by ITU-T or ISO/IEC"
tr (863:3) => tableRow
type: "html"
value: "<td><p>A two-digit integer specifying which of the color primaries from Section 8.1 of the <a href=\"https://www.itu.int/rec/T-REC-H.273/en\">ISO/IEC 23001-8:2016</a> standard. This component, and every component after it, is optional.</p><p>The possible values of the color primaries component are:</p><table class=\"standard-table\"><caption>ISO/IEC Color primary identifiers</caption><thead><tr><th scope=\"col\">Value</th><th scope=\"col\">Details</th></tr></thead><tbody><tr><td><code>00</code></td><td><em>Reserved for future use by ITU or ISO/IEC</em></td></tr><tr><td><code>01</code></td><td>BT.709, sRGB, sYCC. BT.709 is the standard for high definition (HD) television; sRGB is the most common color space used for computer displays. Broadcast BT.709 uses 8-bit color depth with the legal range being from 16 (black) to 235 (white).</td></tr><tr><td><code>02</code></td><td>Image characteristics are unknown, or are to be determined by the application</td></tr><tr><td><code>03</code></td><td><em>Reserved for future use by ITU or ISO/IEC</em></td></tr><tr><td><code>04</code></td><td>BT.470 System M, NTSC (standard definition television in the United States)</td></tr><tr><td><code>05</code></td><td>BT.470 System B, G; BT.601; BT.1358 625; BT.1700 625 PAL and 625 SECAM</td></tr><tr><td><code>06</code></td><td>BT.601 525; BT.1358 525 or 625; BT.1700 NTSC; SMPTE 170M. <em>Functionally identical to <code>7</code>.</em></td></tr><tr><td><code>70</code></td><td>{{R2xvc3NhcnkoIlNNUFRFIik=}} 240M (historical). <em>Functionally identical to <code>6</code>.</em></td></tr><tr><td><code>08</code></td><td>Generic film</td></tr><tr><td><code>09</code></td><td>BT.2020; BT.2100. Used for ultra-high definition (4K) High Dynamic Range (HDR) video, these have a very wide color gamut and support 10-bit and 12-bit color component depths.</td></tr><tr><td><code>10</code></td><td>SMPTE ST 428 (D-Cinema Distribution Master: Image characteristics). Defines the uncompressed image characteristics for DCDM.</td></tr><tr><td><code>11</code></td><td>SMPTE RP 431 (D-Cinema Quality: Reference projector and environment). Describes the reference projector and environment conditions that provide a consistent film presentation experience.</td></tr><tr><td><code>12</code></td><td>SMPTE EG 432 (Digital Source Processing: Color Processing for D-Cinema). Engineering guideline making color signal decoding recommendations for digital movies.</td></tr><tr><td><code>13</code> – <code>21</code></td><td><em>Reserved for future use by ITU-T or ISO/IEC</em></td></tr><tr><td><code>22</code></td><td>EBU Tech 3213-E</td></tr><tr><td><code>23</code> – <code>255</code></td><td><em>Reserved for future use by ITU-T or ISO/IEC</em></td></tr></tbody></table></td>"
table.standard-table (744:1) => table
type: "html"
value: "<tr><td><code>cccc</code></td><td><p>A four-character code indicating which indicates which of the possible codecs is being described. Potential values are:</p><table class=\"standard-table\"><caption>Four-character codes for WebM-supported codecs</caption><thead><tr><th scope=\"col\">Four-character code</th><th scope=\"col\">Codec</th></tr></thead><tbody><tr><td><code>vp08</code></td><td>VP8</td></tr><tr><td><code>vp09</code></td><td>VP9</td></tr><tr><td><code>vp10</code></td><td>VP10</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><td><code>PP</code></td><td><p>The two-digit profile number, padded with leading zeroes if necessary to be exactly two digits.</p><table class=\"standard-table\"><caption>WebM profile numbers</caption><thead><tr><th scope=\"col\">Profile</th><th scope=\"col\">Description</th></tr></thead><tbody><tr><td><code>00</code></td><td>Only 4:2:0 (chroma subsampled both horizontally and vertically). Allows only 8 bits per color component.</td></tr><tr><td><code>01</code></td><td>All chroma subsampling formats are allowed. Allows only 8 bits per color component.</td></tr><tr><td><code>02</code></td><td>Only 4:2:0 (chroma subsampled both horizontally and vertically). Supports 8, 10, or 12 bits per color sample component.</td></tr><tr><td><code>03</code></td><td>All chroma subsampling formats are allowed. Supports 8, 10, or 12 bits per color sample component.</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><td><code>CC</code></td><td><p>A two-digit value indicating which chroma subsampling format to use. The following table lists permitted values; see {{U2VjdGlvbk9uUGFnZSgiZW4tVVMvZG9jcy9XZWIvTWVkaWEvRm9ybWF0cy9WaWRlb19jb25jZXB0cyIsICJDaHJvbWEgc3Vic2FtcGxpbmciKQ==}} for additional information about this topic and others.</p><table class=\"standard-table\"><caption>WebM chroma subsampling identifiers</caption><thead><tr><th scope=\"col\">Value</th><th scope=\"col\">Chroma subsampling format</th></tr></thead><tbody><tr><td><code>00</code></td><td>4:2:0 with the chroma samples sited interstitially between the pixels</td></tr><tr><td><code>01</code></td><td>4:2:0 chroma subsampling with the samples colocated with luma (0, 0)</td></tr><tr><td><code>02</code></td><td>4:2:2 chroma subsampling (4 out of each 4 horizontal pixels' luminance are used)</td></tr><tr><td><code>03</code></td><td>4:4:4 chroma subsampling (every pixel's luminance and chrominance are both retained)</td></tr><tr><td><code>04</code></td><td><em>Reserved</em></td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><td><code>cp</code></td><td><p>A two-digit integer specifying which of the color primaries from Section 8.1 of the <a href=\"https://www.itu.int/rec/T-REC-H.273/en\">ISO/IEC 23001-8:2016</a> standard. This component, and every component after it, is optional.</p><p>The possible values of the color primaries component are:</p><table class=\"standard-table\"><caption>ISO/IEC Color primary identifiers</caption><thead><tr><th scope=\"col\">Value</th><th scope=\"col\">Details</th></tr></thead><tbody><tr><td><code>00</code></td><td><em>Reserved for future use by ITU or ISO/IEC</em></td></tr><tr><td><code>01</code></td><td>BT.709, sRGB, sYCC. BT.709 is the standard for high definition (HD) television; sRGB is the most common color space used for computer displays. Broadcast BT.709 uses 8-bit color depth with the legal range being from 16 (black) to 235 (white).</td></tr><tr><td><code>02</code></td><td>Image characteristics are unknown, or are to be determined by the application</td></tr><tr><td><code>03</code></td><td><em>Reserved for future use by ITU or ISO/IEC</em></td></tr><tr><td><code>04</code></td><td>BT.470 System M, NTSC (standard definition television in the United States)</td></tr><tr><td><code>05</code></td><td>BT.470 System B, G; BT.601; BT.1358 625; BT.1700 625 PAL and 625 SECAM</td></tr><tr><td><code>06</code></td><td>BT.601 525; BT.1358 525 or 625; BT.1700 NTSC; SMPTE 170M. <em>Functionally identical to <code>7</code>.</em></td></tr><tr><td><code>70</code></td><td>{{R2xvc3NhcnkoIlNNUFRFIik=}} 240M (historical). <em>Functionally identical to <code>6</code>.</em></td></tr><tr><td><code>08</code></td><td>Generic film</td></tr><tr><td><code>09</code></td><td>BT.2020; BT.2100. Used for ultra-high definition (4K) High Dynamic Range (HDR) video, these have a very wide color gamut and support 10-bit and 12-bit color component depths.</td></tr><tr><td><code>10</code></td><td>SMPTE ST 428 (D-Cinema Distribution Master: Image characteristics). Defines the uncompressed image characteristics for DCDM.</td></tr><tr><td><code>11</code></td><td>SMPTE RP 431 (D-Cinema Quality: Reference projector and environment). Describes the reference projector and environment conditions that provide a consistent film presentation experience.</td></tr><tr><td><code>12</code></td><td>SMPTE EG 432 (Digital Source Processing: Color Processing for D-Cinema). Engineering guideline making color signal decoding recommendations for digital movies.</td></tr><tr><td><code>13</code> – <code>21</code></td><td><em>Reserved for future use by ITU-T or ISO/IEC</em></td></tr><tr><td><code>22</code></td><td>EBU Tech 3213-E</td></tr><tr><td><code>23</code> – <code>255</code></td><td><em>Reserved for future use by ITU-T or ISO/IEC</em></td></tr></tbody></table></td></tr>"
type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Firefox",type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Available only if available on the underlying operating system's media framework."
tr (47:3) => tableRow
type: "html"
value: "<th scope=\"row\">{{YW5jaCgiQURUUyIp}}</th>",type: "html"
value: "<td><p>Firefox</p><p>Available only if available on the underlying operating system's media framework.</p></td>"
type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "text"
value: "Chrome 3, Firefox 3.5, Edge 17 (desktop only), Internet Explorer 9, Opera 10.50",type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "text"
value: "Edge requires "
type: "link"
title:
url: "https://www.microsoft.com/store/productId/9N5TDP8VCMHS"
children:
type: "text"
value: "Web Media Extensions"
type: "text"
value: " to be installed."
tr (69:3) => tableRow
type: "html"
value: "<th scope=\"row\">{{YW5jaCgiT2dnIik=}}</th>",type: "html"
value: "<td><p>Chrome 3, Firefox 3.5, Edge 17 (desktop only), Internet Explorer 9, Opera 10.50</p><p>Edge requires <a href=\"https://www.microsoft.com/store/productId/9N5TDP8VCMHS\">Web Media Extensions</a> to be installed.</p></td>"
type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 8
shouldWrap: true
children:
type: "text"
value: "Chrome 6, Edge 17 (desktop only), Firefox 4, Opera 10.6, Safari (WebRTC only)",type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 8
shouldWrap: true
children:
type: "text"
value: "Edge requires "
type: "link"
title:
url: "https://www.microsoft.com/store/productId/9N5TDP8VCMHS"
children:
type: "text"
value: "Web Media Extensions"
type: "text"
value: " to be installed."
tr (82:3) => tableRow
type: "html"
value: "<th scope=\"row\">{{YW5jaCgiV2ViTSIp}}</th>",type: "html"
value: "<td><p>Chrome 6, Edge 17 (desktop only), Firefox 4, Opera 10.6, Safari (WebRTC only)</p><p>Edge requires <a href=\"https://www.microsoft.com/store/productId/9N5TDP8VCMHS\">Web Media Extensions</a> to be installed.</p></td>"
table.standard-table (33:1) => table
type: "html"
value: "<tr><th scope=\"row\">Codec name (short)</th><th scope=\"col\">Full codec name</th><th scope=\"col\">Browser compatibility</th></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiM0dQIik=}}</th><td>Third Generation Partnership</td><td>Firefox for Android</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiQURUUyIp}}</th><td>Audio Data Transport Stream</td><td><p>Firefox</p><p>Available only if available on the underlying operating system's media framework.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiRkxBQyIp}}</th><td>Free Lossless Audio Codec</td><td>Chrome 56, Edge 16, Firefox 51, Safari 11</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiTVBFR01QRUctMiIsICJNUEVHIC8gTVBFRy0yIik=}}</th><td>Moving Picture Experts Group (1 and 2)</td><td>—</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiTVBFRy00X01QNCIsICJNUEVHLTQgKE1QNCkiKQ==}}</th><td>Moving Picture Experts Group 4</td><td>Chrome 3, Edge 12, Firefox, Internet Explorer 9, Opera 24, Safari 3.1</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiT2dnIik=}}</th><td>Ogg</td><td><p>Chrome 3, Firefox 3.5, Edge 17 (desktop only), Internet Explorer 9, Opera 10.50</p><p>Edge requires <a href=\"https://www.microsoft.com/store/productId/9N5TDP8VCMHS\">Web Media Extensions</a> to be installed.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiUXVpY2tUaW1lIiwgIlF1aWNrVGltZSAoTU9WKSIp}}</th><td>Apple QuickTime movie</td><td>Only older versions of Safari, plus other browsers that supported Apple's QuickTime plugin</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiV2ViTSIp}}</th><td>Web Media</td><td><p>Chrome 6, Edge 17 (desktop only), Firefox 4, Opera 10.6, Safari (WebRTC only)</p><p>Edge requires <a href=\"https://www.microsoft.com/store/productId/9N5TDP8VCMHS\">Web Media Extensions</a> to be installed.</p></td></tr>"
type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Yes",type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Firefox support for H.264 relies upon the operating system's media infrastructure, so it is available as long as the OS supports it."
tr (479:3) => tableRow
type: "html"
value: "<th scope=\"row\">AVC (H.264)</th>",type: "html"
value: "<td><p>Yes</p><p>Firefox support for H.264 relies upon the operating system's media infrastructure, so it is available as long as the OS supports it.</p></td>"
td (493:4) => tableCell
type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "text"
value: "Yes",type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "text"
value: "Firefox support for AV1 is currently disabled by default; it can be enabled by setting the preference "
type: "inlineCode"
value: "media.av1.enabled"
type: "text"
value: " to "
type: "inlineCode"
value: "true"
type: "text"
value: "."
tr (489:3) => tableRow
type: "html"
value: "<th scope=\"row\">AV1</th>",type: "html"
value: "<td><p>Yes</p><p>Firefox support for AV1 is currently disabled by default; it can be enabled by setting the preference <code>media.av1.enabled</code> to <code>true</code>.</p></td>"
type: "html"
value: "<th scope=\"row\">MPEG-4 Part 2 Visual</th>"
tr (513:3) => tableRow
type: "html"
value: "<th scope=\"row\">VP9</th>"
table.standard-table (464:1) => table
type: "html"
value: "<tr><th rowspan=\"2\" scope=\"row\" style=\"vertical-align: bottom;\">Codec</th><th colspan=\"4\" scope=\"col\" style=\"text-align: center;\">Browser support</th></tr>",type: "html"
value: "<tr><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Safari</th></tr>",type: "html"
value: "<tr><th scope=\"row\">AVC (H.264)</th><td></td><td></td><td><p>Yes</p><p>Firefox support for H.264 relies upon the operating system's media infrastructure, so it is available as long as the OS supports it.</p></td><td></td></tr>",type: "html"
value: "<tr><th scope=\"row\">AV1</th><td></td><td></td><td><p>Yes</p><p>Firefox support for AV1 is currently disabled by default; it can be enabled by setting the preference <code>media.av1.enabled</code> to <code>true</code>.</p></td><td></td></tr>",type: "html"
value: "<tr><th scope=\"row\">H.263</th><td></td><td></td><td>No</td><td></td></tr>",type: "html"
value: "<tr><th scope=\"row\">MPEG-4 Part 2 Visual</th><td></td><td></td><td>No</td><td></td></tr>",type: "html"
value: "<tr><th scope=\"row\">VP9</th><td></td><td></td><td>Yes</td><td></td></tr>"
type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Yes",type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Firefox support for H.264 relies upon the operating system's media infrastructure, so it is available as long as the OS supports it."
tr (538:3) => tableRow
type: "html"
value: "<th scope=\"row\">AAC</th>",type: "html"
value: "<td><p>Yes</p><p>Firefox support for H.264 relies upon the operating system's media infrastructure, so it is available as long as the OS supports it.</p></td>"
tr (548:3) => tableRow
type: "html"
value: "<th scope=\"row\">FLAC</th>"
tr (555:3) => tableRow
type: "html"
value: "<th scope=\"row\">MPEG-1 Audio Layer III (MP3)</th>"
tr (562:3) => tableRow
type: "html"
value: "<th scope=\"row\">Opus</th>"
table.standard-table (523:1) => table
type: "html"
value: "<tr><th rowspan=\"2\" scope=\"row\" style=\"vertical-align: bottom;\">Codec</th><th colspan=\"4\" scope=\"col\" style=\"text-align: center;\">Browser support</th></tr>",type: "html"
value: "<tr><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Safari</th></tr>",type: "html"
value: "<tr><th scope=\"row\">AAC</th><td></td><td></td><td><p>Yes</p><p>Firefox support for H.264 relies upon the operating system's media infrastructure, so it is available as long as the OS supports it.</p></td><td></td></tr>",type: "html"
value: "<tr><th scope=\"row\">FLAC</th><td></td><td></td><td>Yes</td><td></td></tr>",type: "html"
value: "<tr><th scope=\"row\">MPEG-1 Audio Layer III (MP3)</th><td></td><td></td><td>Yes</td><td></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Opus</th><td></td><td></td><td>Yes</td><td></td></tr>"
type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Yes",type: "paragraph"
summary: "In this guide, we'll look at the container formats used most commonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Firefox support for AV1 was added to macOS in Firefox 66; for Windows in Firefox 67; and Firefox 68 on Linux. Firefox for Android does not yet support AV1; the implementation in Firefox is designed to use a secure process, which is not supported yet in Android."
tr (993:3) => tableRow
type: "html"
value: "<th scope=\"row\">AV1</th>",type: "html"
value: "<td><p>Yes</p><p>Firefox support for AV1 was added to macOS in Firefox 66; for Windows in Firefox 67; and Firefox 68 on Linux. Firefox for Android does not yet support AV1; the implementation in Firefox is designed to use a secure process, which is not supported yet in Android.</p></td>"
tr (1003:3) => tableRow
type: "html"
value: "<th scope=\"row\">VP8</th>"
tr (1010:3) => tableRow
type: "html"
value: "<th scope=\"row\">VP9</th>"
table.standard-table (978:1) => table
type: "html"
value: "<tr><th rowspan=\"2\" scope=\"row\" style=\"vertical-align: bottom;\">Codec</th><th colspan=\"4\" scope=\"col\" style=\"text-align: center;\">Browser support</th></tr>",type: "html"
value: "<tr><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Safari</th></tr>",type: "html"
value: "<tr><th scope=\"row\">AV1</th><td>Yes</td><td>Yes</td><td><p>Yes</p><p>Firefox support for AV1 was added to macOS in Firefox 66; for Windows in Firefox 67; and Firefox 68 on Linux. Firefox for Android does not yet support AV1; the implementation in Firefox is designed to use a secure process, which is not supported yet in Android.</p></td><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">VP8</th><td>Yes</td><td>Yes</td><td>Yes</td><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">VP9</th><td>Yes</td><td>Yes</td><td>Yes</td><td>Yes</td></tr>"
type: "paragraph"
summary: "In this guide, we'll cover the image file types generally supported by web browsers, and provide insights that will help you select the most appropriate formats to use for your site's imagery."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Good choice for both images and animated images due to high performance and royalty free image format. It offers much better compression than PNG or JPEG with support for higher color depths, animated frames, transparency etc. Note that when using AVIF, you should include fallbacks to formats with better browser support (i.e. using the "
type: "link"
title:
url: "/en-US/docs/Web/HTML/Element/picture"
children:
type: "inlineCode"
value: "<picture>"
type: "text"
value: " element). "
type: "break"
type: "strong"
children:
type: "text"
value: "Supported:"
type: "text"
value: " Chrome, Opera, Firefox (still images only: animated images not implemented)."
tr (57:3) => tableRow
type: "html"
value: "<th scope=\"row\"><a href=\"#AVIF_image\">AVIF</a></th>",type: "html"
value: "<th scope=\"row\">AV1 Image File Format</th>",type: "html"
value: "<td><p>Good choice for both images and animated images due to high performance and royalty free image format. It offers much better compression than PNG or JPEG with support for higher color depths, animated frames, transparency etc. Note that when using AVIF, you should include fallbacks to formats with better browser support (i.e. using the <code><a href=\"/en-US/docs/Web/HTML/Element/picture\"><picture></a></code> element). <br><strong>Supported:</strong> Chrome, Opera, Firefox (still images only: animated images not implemented).</p></td>"
type: "paragraph"
summary: "In this guide, we'll cover the image file types generally supported by web browsers, and provide insights that will help you select the most appropriate formats to use for your site's imagery."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "text"
value: "Good choice for lossy compression of still images (currently the most popular). Prefer PNG when more precise reproduction of the image is required, or WebP/AVIF if both better reproduction and higher compression are required."
type: "break"
type: "strong"
children:
type: "text"
value: "Support:"
type: "text"
value: " Chrome, Edge, Firefox, IE, Opera, Safari."
tr (75:3) => tableRow
type: "html"
value: "<th scope=\"row\"><a href=\"#JPEG_Joint_Photographic_Experts_Group_image\">JPEG</a></th>",type: "html"
value: "<th scope=\"row\">Joint Photographic Expert Group image</th>",type: "html"
value: "<td><p>Good choice for lossy compression of still images (currently the most popular). Prefer PNG when more precise reproduction of the image is required, or WebP/AVIF if both better reproduction and higher compression are required.<br><strong>Support:</strong> Chrome, Edge, Firefox, IE, Opera, Safari.</p></td>"
td (90:4) => tableCell
type: "paragraph"
summary: "In this guide, we'll cover the image file types generally supported by web browsers, and provide insights that will help you select the most appropriate formats to use for your site's imagery."
locale: "en-US"
rowIndex: 5
shouldWrap: true
children:
type: "text"
value: "PNG is preferred over JPEG for more precise reproduction of source images, or when transparency is needed. WebP/AVIF provide even better compression and reproduction, but browser support is more limited."
type: "break"
type: "strong"
children:
type: "text"
value: "Support:"
type: "text"
value: " Chrome, Edge, Firefox, IE, Opera, Safari."
tr (85:3) => tableRow
type: "html"
value: "<th scope=\"row\"><a href=\"#PNG_Portable_Network_Graphics\">PNG</a></th>",type: "html"
value: "<th scope=\"row\">Portable Network Graphics</th>",type: "html"
value: "<td><p>PNG is preferred over JPEG for more precise reproduction of source images, or when transparency is needed. WebP/AVIF provide even better compression and reproduction, but browser support is more limited.<br><strong>Support:</strong> Chrome, Edge, Firefox, IE, Opera, Safari.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Abbreviation</th><th scope=\"row\">File format</th><th scope=\"col\">MIME type</th><th scope=\"col\">File extension(s)</th><th scope=\"col\">Summary</th></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"#APNG_Animated_Portable_Network_Graphics\">APNG</a></th><th scope=\"row\">Animated Portable Network Graphics</th><td><code>image/apng</code></td><td><code>.apng</code></td><td>Good choice for lossless animation sequences (GIF is less performant). AVIF and WebP have better performance but less broad browser support.<br><strong>Supported</strong>: Chrome, Edge, Firefox, Opera, Safari.</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"#AVIF_image\">AVIF</a></th><th scope=\"row\">AV1 Image File Format</th><td><code>image/avif</code></td><td><code>.avif</code></td><td><p>Good choice for both images and animated images due to high performance and royalty free image format. It offers much better compression than PNG or JPEG with support for higher color depths, animated frames, transparency etc. Note that when using AVIF, you should include fallbacks to formats with better browser support (i.e. using the <code><a href=\"/en-US/docs/Web/HTML/Element/picture\"><picture></a></code> element). <br><strong>Supported:</strong> Chrome, Opera, Firefox (still images only: animated images not implemented).</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"#GIF_Graphics_Interchange_Format\">GIF</a></th><th scope=\"row\">Graphics Interchange Format</th><td><code>image/gif</code></td><td><code>.gif</code></td><td>Good choice for simple images and animations. Prefer PNG for lossless <em>and</em> indexed still images, and consider WebP, AVIF or APNG for animation sequences.<br><strong>Supported:</strong> Chrome, Edge, Firefox, IE, Opera, Safari.</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"#JPEG_Joint_Photographic_Experts_Group_image\">JPEG</a></th><th scope=\"row\">Joint Photographic Expert Group image</th><td><code>image/jpeg</code></td><td><code>.jpg</code>, <code>.jpeg</code>, <code>.jfif</code>, <code>.pjpeg</code>, <code>.pjp</code></td><td><p>Good choice for lossy compression of still images (currently the most popular). Prefer PNG when more precise reproduction of the image is required, or WebP/AVIF if both better reproduction and higher compression are required.<br><strong>Support:</strong> Chrome, Edge, Firefox, IE, Opera, Safari.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"#PNG_Portable_Network_Graphics\">PNG</a></th><th scope=\"row\">Portable Network Graphics</th><td><code>image/png</code></td><td><code>.png</code></td><td><p>PNG is preferred over JPEG for more precise reproduction of source images, or when transparency is needed. WebP/AVIF provide even better compression and reproduction, but browser support is more limited.<br><strong>Support:</strong> Chrome, Edge, Firefox, IE, Opera, Safari.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"#SVG_Scalable_Vector_Graphics\">SVG</a></th><th scope=\"row\">Scalable Vector Graphics</th><td><code>image/svg+xml</code></td><td><code>.svg</code></td><td>Vector image format; ideal for user interface elements, icons, diagrams, etc., that must be drawn accurately at different sizes.<br><strong>Support:</strong> Chrome, Edge, Firefox, IE, Opera, Safari.</td></tr>",type: "html"
value: "<tr><th scope=\"row\"><a href=\"#WebP_image\">WebP</a></th><th scope=\"row\">Web Picture format</th><td><code>image/webp</code></td><td><code>.webp</code></td><td>Excellent choice for both images and animated images. WebP offers much better compression than PNG or JPEG with support for higher color depths, animated frames, transparency etc. AVIF offers slightly better compression, but is not quite as well-supported in browsers and does not support progressive rendering.<br><strong>Support:</strong> Chrome, Edge, Firefox, Opera, Safari</td></tr>"
type: "html"
value: "<th scope=\"row\">Greyscale with alpha</th>"
tr (229:7) => tableRow
type: "html"
value: "<th scope=\"row\">True color with alpha</th>"
table.standard-table (200:5) => table
type: "html"
value: "<tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale</th><td>1, 2, 4, 8, and 16</td><td>Each pixel consists of a single <em>D</em>-bit value indicating the brightness of the greyscale pixel.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three <em>D</em>-bit values indicating the level of the red, green, and blue color components.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Indexed color</th><td>1, 2, 4, and 8</td><td>Each pixel is a <em>D</em>-bit value indicating an index into a color palette which is contained within a <code><a href=\"https://www.w3.org/TR/PNG/#11PLTE\">PLTE</a></code> chunk in the APNG file; the colors in the palette all use an 8-bit depth.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale with alpha</th><td>8 and 16</td><td>Each pixel is represented by two <em>D</em>-bit values: the intensity of the greyscale pixel and an alpha sample, indicating how opaque the pixel is.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is comprised of four <em>D</em>-pixel color components: red, green, blue, and the alpha sample indicating how opaque the pixel is.</td></tr>"
tr (197:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>"
type: "html"
value: "<tr><th scope=\"row\">MIME type</th><td><code>image/apng</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">File extension(s)</th><td><code>.apng</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><a href=\"https://wiki.mozilla.org/APNG_Specification\">wiki.mozilla.org/APNG_Specification</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td>Chrome 59, Edge 12, Firefox 3, Opera 46, Safari 8</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum dimensions</th><td>2,147,483,647×2,147,483,647 pixels</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><table class=\"standard-table\"><thead><tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr></thead><tbody><tr><th scope=\"row\">Greyscale</th><td>1, 2, 4, 8, and 16</td><td>Each pixel consists of a single <em>D</em>-bit value indicating the brightness of the greyscale pixel.</td></tr><tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three <em>D</em>-bit values indicating the level of the red, green, and blue color components.</td></tr><tr><th scope=\"row\">Indexed color</th><td>1, 2, 4, and 8</td><td>Each pixel is a <em>D</em>-bit value indicating an index into a color palette which is contained within a <code><a href=\"https://www.w3.org/TR/PNG/#11PLTE\">PLTE</a></code> chunk in the APNG file; the colors in the palette all use an 8-bit depth.</td></tr><tr><th scope=\"row\">Greyscale with alpha</th><td>8 and 16</td><td>Each pixel is represented by two <em>D</em>-bit values: the intensity of the greyscale pixel and an alpha sample, indicating how opaque the pixel is.</td></tr><tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is comprised of four <em>D</em>-pixel color components: red, green, blue, and the alpha sample indicating how opaque the pixel is.</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossless</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Free and open under the <a href=\"https://creativecommons.org/licenses/by-sa/3.0/\">Creative Commons Attribution-ShareAlike license</a> (<a href=\"https://creativecommons.org/licenses/by-sa/3.0/\">CC-BY-SA</a>) version 3.0 or later.</td></tr>"
type: "paragraph"
summary: "In this guide, we'll cover the image file types generally supported by web browsers, and provide insights that will help you select the most appropriate formats to use for your site's imagery."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "link"
title:
url: "https://aomediacodec.github.io/av1-avif/"
children:
type: "text"
value: "AV1 Image File Format (AVIF)"
type: "list"
ordered: false
start:
spread: false
children:
type: "listItem"
spread: false
children:
type: "paragraph"
children:
type: "text"
value: "Firefox 93 supports still images, with colorspace support for both full and limited range colors, image transforms for mirroring and rotation. The preference "
type: "link"
title:
url: "/en-US/docs/Mozilla/Firefox/Experimental_features#avif_compliance_strictness"
children:
type: "text"
value: "image.avif.compliance_strictness"
type: "text"
value: " can be used to adjust the compliance strictness with the specification. Animated images are not supported."
type: "listItem"
spread: false
children:
type: "paragraph"
children:
type: "text"
value: "Firefox 77 to 92 require the preference "
type: "inlineCode"
value: "image.avif.enable"
type: "text"
value: " set "
type: "inlineCode"
value: "true"
type: "text"
value: ". Earlier versions provide only basic support."
tr (295:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td>Chrome 85, Opera 71, and Firefox 93.<ul><li>Firefox 93 supports still images, with colorspace support for both full and limited range colors, image transforms for mirroring and rotation. The preference <a href=\"/en-US/docs/Mozilla/Firefox/Experimental_features#avif_compliance_strictness\">image.avif.compliance_strictness</a> can be used to adjust the compliance strictness with the specification.\nAnimated images are not supported.</li><li>Firefox 77 to 92 require the preference <code>image.avif.enable</code> set <code>true</code>. Earlier versions provide only basic support.</li></ul></td>"
type: "html"
value: "<tr><th scope=\"row\">MIME type</th><td><code>image/avif</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">File extension(s)</th><td><code>.avif</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><p><a href=\"https://aomediacodec.github.io/av1-avif/\">AV1 Image File Format (AVIF)</a></p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td>Chrome 85, Opera 71, and Firefox 93.<ul><li>Firefox 93 supports still images, with colorspace support for both full and limited range colors, image transforms for mirroring and rotation. The preference <a href=\"/en-US/docs/Mozilla/Firefox/Experimental_features#avif_compliance_strictness\">image.avif.compliance_strictness</a> can be used to adjust the compliance strictness with the specification.\nAnimated images are not supported.</li><li>Firefox 77 to 92 require the preference <code>image.avif.enable</code> set <code>true</code>. Earlier versions provide only basic support.</li></ul></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum dimensions</th><td>2,147,483,647×2,147,483,647 pixels</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><p>Color mode support information is provided in the <a href=\"https://aomediacodec.github.io/av1-spec/av1-spec.pdf\">AV1 Bitstream & Decoding Process Specification</a>, section 6.4.2 : Color config semantics.</p><p>A non-exhaustive summary is:</p><ul><li>Color modes: YUV444, YUV422, YUV420</li><li>Greyscale support: YUV400</li><li>Bits: 8/10/12 bit</li><li>Alpha support</li><li>ICC profile support</li><li>NCLX support: sRGB, linear sRGB, linear Rec2020, PQ Rec2020, HLG Rec2020, PQ P3, HLG P3, etc.</li><li>Tiling support</li></ul></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy and lossless.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Royalty free. Licensing information is available at http://aomedia.org/license/ .</td></tr>"
type: "html"
value: "<th scope=\"row\">Greyscale with alpha</th>"
tr (406:7) => tableRow
type: "html"
value: "<th scope=\"row\">True color with alpha</th>"
table.standard-table (377:5) => table
type: "html"
value: "<tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale</th><td>1</td><td>Each bit represents a single pixel, which can be either black or white.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three values representing the red, green, and blue color components; each is <em>D</em> bits.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Indexed color</th><td>2, 4, and 8</td><td>Each pixel is represented by a value which is one 2, 4, or 8 bits, serving as an index into the color table.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale with alpha</th><td><em>n/a</em></td><td>BMP has no distinct grayscale format.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is represented by four values representing the red, green, blue, and alpha color components; each is <em>D</em> bits.</td></tr>"
tr (374:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>"
type: "html"
value: "<tr><th scope=\"row\">MIME type</th><td><code>image/bmp</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">File extension(s)</th><td><code>.bmp</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td>No specification; however, Microsoft provides general documentation of the format at <a href=\"https://docs.microsoft.com/en-us/windows/desktop/gdi/bitmap-storage\">docs.microsoft.com/en-us/windows/desktop/gdi/bitmap-storage</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td>All versions of Chrome, Edge, Firefox, Internet Explorer, Opera, and Safari</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum dimensions</th><td>Either 32,767×32,767 or 2,147,483,647×2,147,483,647 pixels, depending on the format version</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><table class=\"standard-table\"><thead><tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr></thead><tbody><tr><th scope=\"row\">Greyscale</th><td>1</td><td>Each bit represents a single pixel, which can be either black or white.</td></tr><tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three values representing the red, green, and blue color components; each is <em>D</em> bits.</td></tr><tr><th scope=\"row\">Indexed color</th><td>2, 4, and 8</td><td>Each pixel is represented by a value which is one 2, 4, or 8 bits, serving as an index into the color table.</td></tr><tr><th scope=\"row\">Greyscale with alpha</th><td><em>n/a</em></td><td>BMP has no distinct grayscale format.</td></tr><tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is represented by four values representing the red, green, blue, and alpha color components; each is <em>D</em> bits.</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Several compression methods are supported, including lossy or lossless algorithms</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Covered by the <a href=\"https://docs.microsoft.com/en-us/openspecs/dev_center/ms-devcentlp/1c24c7c8-28b0-4ce1-a47d-95fe1ff504bc\">Microsoft Open Specification Promise</a>; while Microsoft holds patents against BMP, they have published a promise not to assert its patent rights as long as specific conditions are met. This is not the same as a license, however. BMP is included under the Windows Metafile Format (<code>.wmf</code>).</td></tr>"
type: "html"
value: "<th scope=\"row\">Greyscale with alpha</th>"
tr (497:7) => tableRow
type: "html"
value: "<th scope=\"row\">True color with alpha</th>"
table.standard-table (468:5) => table
type: "html"
value: "<tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale</th><td><em>n/a</em></td><td>GIF does not include a dedicated greyscale format.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color</th><td><em>n/a</em></td><td>GIF does not support true color pixels.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Indexed color</th><td>8</td><td>Each color in a GIF palette is defined as 8 bits each of red, green, and blue (24 total bits per pixel).</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale with alpha</th><td><em>n/a</em></td><td>GIF does not provide a dedicated greyscale format.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color with alpha</th><td><em>n/a</em></td><td>GIF does not support true color pixels.</td></tr>"
tr (465:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>"
type: "html"
value: "<tr><th scope=\"row\">MIME type</th><td><code>image/gif</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">File extension(s)</th><td><code>.gif</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><a href=\"https://www.w3.org/Graphics/GIF/spec-gif87.txt\">GIF87a specification</a><br><a href=\"https://www.w3.org/Graphics/GIF/spec-gif89a.txt\">GIF89a specification</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td>All versions of Chrome, Edge, Firefox, Internet Explorer, Opera, and Safari</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum dimensions</th><td>65,536×65,536 pixels</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><table class=\"standard-table\"><thead><tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr></thead><tbody><tr><th scope=\"row\">Greyscale</th><td><em>n/a</em></td><td>GIF does not include a dedicated greyscale format.</td></tr><tr><th scope=\"row\">True color</th><td><em>n/a</em></td><td>GIF does not support true color pixels.</td></tr><tr><th scope=\"row\">Indexed color</th><td>8</td><td>Each color in a GIF palette is defined as 8 bits each of red, green, and blue (24 total bits per pixel).</td></tr><tr><th scope=\"row\">Greyscale with alpha</th><td><em>n/a</em></td><td>GIF does not provide a dedicated greyscale format.</td></tr><tr><th scope=\"row\">True color with alpha</th><td><em>n/a</em></td><td>GIF does not support true color pixels.</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossless (LZW)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>While the GIF format itself is open, the LZW compression algorithm was covered by patents until the early 2000s. As of July 7, 2004, all relevant patents have expired and the GIF format may be used freely</td></tr>"
type: "html"
value: "<th scope=\"row\">Greyscale with alpha</th>"
tr (580:7) => tableRow
type: "html"
value: "<th scope=\"row\">True color with alpha</th>"
table.standard-table (552:5) => table
type: "html"
value: "<tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale</th><td>1</td><td>Each bit represents a single pixel, which can be either black or white.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three values representing the red, green, and blue color components; each is <em>D</em> bits.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Indexed color</th><td>2, 4, and 8</td><td>Each pixel is represented by a value which is one 2, 4, or 8 bits, serving as an index into the color table.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale with alpha</th><td><em>n/a</em></td><td>BMP has no distinct grayscale format.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is represented by four values representing the red, green, blue, and alpha color components; each is <em>D</em> bits.</td></tr>"
type: "html"
value: "<th scope=\"row\">Greyscale with alpha</th>"
tr (616:7) => tableRow
type: "html"
value: "<th scope=\"row\">True color with alpha</th>"
table.standard-table (588:5) => table
type: "html"
value: "<tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale</th><td>1, 2, 4, 8, and 16</td><td>Each pixel consists of a single <em>D</em>-bit value indicating the brightness of the greyscale pixel.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three <em>D</em>-bit values indicating the level of the red, green, and blue color components.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Indexed color</th><td>1, 2, 4, and 8</td><td>Each pixel is a <em>D</em>-bit value indicating an index into a color palette which is contained within a <code><a href=\"https://www.w3.org/TR/PNG/#11PLTE\">PLTE</a></code> chunk in the APNG file; the colors in the palette all use an 8-bit depth.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale with alpha</th><td>8 and 16</td><td>Each pixel is represented by two <em>D</em>-bit values: the intensity of the greyscale pixel and an alpha sample, indicating how opaque the pixel is.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is comprised of four <em>D</em>-pixel color components: red, green, blue, and the alpha sample indicating how opaque the pixel is.</td></tr>"
tr (549:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>"
type: "html"
value: "<tr><th scope=\"row\">MIME type</th><td><code>image/vnd.microsoft.icon</code> (official), <code>image/x-icon</code> (used by Microsoft)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">File extension(s)</th><td><code>.ico</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td>All versions of Chrome, Edge, Firefox, Internet Explorer, Opera, and Safari</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum dimensions</th><td>256×256 pixels</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><table class=\"standard-table\"><caption>Icons in BMP format</caption><tbody><tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr><tr><th scope=\"row\">Greyscale</th><td>1</td><td>Each bit represents a single pixel, which can be either black or white.</td></tr><tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three values representing the red, green, and blue color components; each is <em>D</em> bits.</td></tr><tr><th scope=\"row\">Indexed color</th><td>2, 4, and 8</td><td>Each pixel is represented by a value which is one 2, 4, or 8 bits, serving as an index into the color table.</td></tr><tr><th scope=\"row\">Greyscale with alpha</th><td><em>n/a</em></td><td>BMP has no distinct grayscale format.</td></tr><tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is represented by four values representing the red, green, blue, and alpha color components; each is <em>D</em> bits.</td></tr></tbody></table><table class=\"standard-table\"><caption>Icons in PNG format</caption><tbody><tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr><tr><th scope=\"row\">Greyscale</th><td>1, 2, 4, 8, and 16</td><td>Each pixel consists of a single <em>D</em>-bit value indicating the brightness of the greyscale pixel.</td></tr><tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three <em>D</em>-bit values indicating the level of the red, green, and blue color components.</td></tr><tr><th scope=\"row\">Indexed color</th><td>1, 2, 4, and 8</td><td>Each pixel is a <em>D</em>-bit value indicating an index into a color palette which is contained within a <code><a href=\"https://www.w3.org/TR/PNG/#11PLTE\">PLTE</a></code> chunk in the APNG file; the colors in the palette all use an 8-bit depth.</td></tr><tr><th scope=\"row\">Greyscale with alpha</th><td>8 and 16</td><td>Each pixel is represented by two <em>D</em>-bit values: the intensity of the greyscale pixel and an alpha sample, indicating how opaque the pixel is.</td></tr><tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is comprised of four <em>D</em>-pixel color components: red, green, blue, and the alpha sample indicating how opaque the pixel is.</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>BMP-format icons nearly always use lossless compression, but lossy methods are available. PNG icons are always compressed losslessly.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>—</td></tr>"
type: "html"
value: "<th scope=\"row\">Greyscale with alpha</th>"
tr (696:7) => tableRow
type: "html"
value: "<th scope=\"row\">True color with alpha</th>"
table.standard-table (667:5) => table
type: "html"
value: "<tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale</th><td><em>n/a</em></td><td>JPEG has no distinct greyscale mode.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color</th><td>8</td><td>Each pixel is described by the red, blue, and green color components, each of which is 8 bits.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Indexed color</th><td><em>n/a</em></td><td>JPEG does not offer an indexed color mode.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale with alpha</th><td><em>n/a</em></td><td>JPEG does not support an alpha channel.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color with alpha</th><td><em>n/a</em></td><td>JPEG does not support an alpha channel.</td></tr>"
tr (664:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>"
type: "html"
value: "<tr><th scope=\"row\">MIME type</th><td><code>image/jpeg</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">File extension(s)</th><td><code>.jpg</code>, <code>.jpeg</code>, <code>.jpe</code>, <code>.jif</code>, <code>.jfif</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><a href=\"https://jpeg.org/jpeg/\">jpeg.org/jpeg/</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td>All versions of Chrome, Edge, Firefox, Internet Explorer, Opera, and Safari</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum dimensions</th><td>65,535×65,535 pixels</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><table class=\"standard-table\"><thead><tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr></thead><tbody><tr><th scope=\"row\">Greyscale</th><td><em>n/a</em></td><td>JPEG has no distinct greyscale mode.</td></tr><tr><th scope=\"row\">True color</th><td>8</td><td>Each pixel is described by the red, blue, and green color components, each of which is 8 bits.</td></tr><tr><th scope=\"row\">Indexed color</th><td><em>n/a</em></td><td>JPEG does not offer an indexed color mode.</td></tr><tr><th scope=\"row\">Greyscale with alpha</th><td><em>n/a</em></td><td>JPEG does not support an alpha channel.</td></tr><tr><th scope=\"row\">True color with alpha</th><td><em>n/a</em></td><td>JPEG does not support an alpha channel.</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy; based on the {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiZGlzY3JldGUgY29zaW5lIHRyYW5zZm9ybSIp}}</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>As of October 27, 2006, all United States patents have expired.</td></tr>"
type: "html"
value: "<th scope=\"row\">Greyscale with alpha</th>"
tr (839:7) => tableRow
type: "html"
value: "<th scope=\"row\">True color with alpha</th>"
table.standard-table (810:5) => table
type: "html"
value: "<tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale</th><td>1, 2, 4, 8, and 16</td><td>Each pixel consists of a single <em>D</em>-bit value indicating the brightness of the greyscale pixel.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color</th><td>8 and 16</td><td>Each pixel is represented by three <em>D</em>-bit values indicating the level of the red, green, and blue color components.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Indexed color</th><td>1, 2, 4, and 8</td><td>Each pixel is a <em>D</em>-bit value indicating an index into a color palette which is contained within a <code><a href=\"https://www.w3.org/TR/PNG/#11PLTE\">PLTE</a></code> chunk in the APNG file; the colors in the palette all use an 8-bit depth.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale with alpha</th><td>8 and 16</td><td>Each pixel is represented by two <em>D</em>-bit values: the intensity of the greyscale pixel and an alpha sample, indicating how opaque the pixel is.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color with alpha</th><td>8 and 16</td><td>Each pixel is comprised of four <em>D</em>-pixel color components: red, green, blue, and the alpha sample indicating how opaque the pixel is.</td></tr>"
tr (807:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>"
type: "html"
value: "<th scope=\"row\">Greyscale with alpha</th>"
tr (1068:7) => tableRow
type: "html"
value: "<th scope=\"row\">True color with alpha</th>"
table.standard-table (1036:5) => table
type: "html"
value: "<tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Bilevel</th><td>1</td><td>A bilevel TIFF stores 8 bits in each byte, one bit per pixel. The <code>PhotometricInterpretation</code> field specifies which of 0 and 1 are black and which is white.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale</th><td>4 and 8</td><td>Each pixel consists of a single <em>D</em>-bit value indicating the brightness of the greyscale pixel.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color</th><td>8</td><td>All true color RGB images are stored using 8-bits each of red, green, and blue.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Indexed color</th><td>4 and 8</td><td>Each pixel is an index into a <code>ColorMap</code> record, which defines the colors used in the image. The color map lists all of the red values, then all of the green values, then all of the blue values (rather than <code>rgb, rgb, rgb...</code>).</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Greyscale with alpha</th><td>4 and 8</td><td>Alpha information is added by specifying that there are more than 3 samples per pixel in the <code>SamplesPerPixel</code> field, and indicating the type of alpha (1 for an associated, pre-multiplied alpha component, and 2 for unassociated alpha (a separate matte); however, alpha channels are rarely used in TIFF files and may be unsupported by the user's software.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">True color with alpha</th><td>8</td><td>Alpha information is added by specifying that there are more than 3 samples per pixel in the <code>SamplesPerPixel</code> field, and indicating the type of alpha (1 for an associated, pre-multiplied alpha component, and 2 for unassociated alpha (a separate matte); however, alpha channels are rarely used in TIFF files and may be unsupported by the user's software.</td></tr>"
tr (1033:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>"
type: "html"
value: "<tr><th scope=\"row\">MIME type</th><td><code>image/tiff</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">File extension(s)</th><td><code>.tif</code>, <code>.tiff</code></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><a href=\"https://www.adobe.io/open/standards/TIFF.html\">adobe.io/open/standards/TIFF.html</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td>No browsers integrate support for TIFF; its value is as a download format</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Maximum dimensions</th><td>4,294,967,295×4,294,967,295 pixels (theoretical)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Color mode</th><th scope=\"col\">Bits per component (<em>D</em>)</th><th scope=\"col\">Description</th></tr><tr><th scope=\"row\">Bilevel</th><td>1</td><td>A bilevel TIFF stores 8 bits in each byte, one bit per pixel. The <code>PhotometricInterpretation</code> field specifies which of 0 and 1 are black and which is white.</td></tr><tr><th scope=\"row\">Greyscale</th><td>4 and 8</td><td>Each pixel consists of a single <em>D</em>-bit value indicating the brightness of the greyscale pixel.</td></tr><tr><th scope=\"row\">True color</th><td>8</td><td>All true color RGB images are stored using 8-bits each of red, green, and blue.</td></tr><tr><th scope=\"row\">Indexed color</th><td>4 and 8</td><td>Each pixel is an index into a <code>ColorMap</code> record, which defines the colors used in the image. The color map lists all of the red values, then all of the green values, then all of the blue values (rather than <code>rgb, rgb, rgb...</code>).</td></tr><tr><th scope=\"row\">Greyscale with alpha</th><td>4 and 8</td><td>Alpha information is added by specifying that there are more than 3 samples per pixel in the <code>SamplesPerPixel</code> field, and indicating the type of alpha (1 for an associated, pre-multiplied alpha component, and 2 for unassociated alpha (a separate matte); however, alpha channels are rarely used in TIFF files and may be unsupported by the user's software.</td></tr><tr><th scope=\"row\">True color with alpha</th><td>8</td><td>Alpha information is added by specifying that there are more than 3 samples per pixel in the <code>SamplesPerPixel</code> field, and indicating the type of alpha (1 for an associated, pre-multiplied alpha component, and 2 for unassociated alpha (a separate matte); however, alpha channels are rarely used in TIFF files and may be unsupported by the user's software.</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Most TIFF files are uncompressed, but lossless PackBits and LZW compression are supported, as is lossy JPEG compression.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>No license required (aside from any associated with libraries you might use); all known patents have expired.</td></tr>"
type: "paragraph"
summary: "In this guide, we'll cover the image file types generally supported by web browsers, and provide insights that will help you select the most appropriate formats to use for your site's imagery."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "link"
title:
url: "https://developers.google.com/speed/webp/docs/riff_container"
children:
type: "text"
value: "RIFF Container Specification"
type: "break"
type: "text"
value: "{{UkZDKDYzODYsICJWUDggRGF0YSBGb3JtYXQgYW5kIERlY29kaW5nIEd1aWRlIik=}} (lossy encoding)"
type: "break"
type: "link"
title:
url: "https://developers.google.com/speed/webp/docs/webp_lossless_bitstream_specification"
children:
type: "text"
value: "WebP Lossless Bitstream Specification"
type: "html"
value: "<th scope=\"row\">Resolution (width and height)</th>"
table.standard-table (121:1) => table
type: "html"
value: "<tr><th scope=\"row\">Feature</th><th scope=\"col\">Effect on quality</th><th scope=\"col\">Effect on size</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Color depth (bit depth)</th><td>The higher the color bit depth, the higher the quality of color fidelity is achieved in the video. Additionally, in saturated portions of the image (that is, where colors are pure and intense, such as a bright, pure red [<code>rgba(255, 0, 0, 1)</code>]), color depths below 10 bits per component (10-bit color) allow banding, where gradients cannot be represented without visible stepping of the colors.</td><td>Depending on the codec, higher color depths may result in larger compressed file sizes. The determining factor is what internal storage format is used for the compressed data.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Frame rate</th><td>Primarily affects the perceived smoothness of the motion in the image. To a point, the higher the frame rate, the smoother and more realistic the motion will appear. Eventually the point of diminishing returns is reached. See <a href=\"#reduced_frame_rate\">Frame rate</a> below for details.</td><td>Assuming the frame rate is not reduced during encoding, higher frame rates cause larger compressed video sizes.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Motion</th><td>Compression of video typically works by comparing frames, finding where they differ, and constructing records containing enough information to update the previous frame to approximate the appearance of the following frame. The more successive frames differ from one another, the larger these differences are, and the less effective the compression is at avoiding the introduction of artifacts into the compressed video.</td><td>The complexity introduced by motion results in larger intermediate frames due to the higher number of differences between frames). For this and other reasons, the more motion there is in a video, the larger the output file will typically be.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Noise</th><td>Picture noise (such as film grain effects, dust, or other grittiness to the image) introduces variability. Variability generally makes compression more difficult, resulting in more lost quality due to the need to drop details to achieve the same level of compression.</td><td>The more variability—such as noise—there is in the image, the more complex the compression process and the less success the algorithm is likely to have compressing the image to the same degree. Unless you configure the encoder in a way that ignores some or all of the variations caused by noise, the compressed video will be larger.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Resolution (width and height)</th><td>Higher resolution video, presented in the same screen size, will typically be able to more accurately portray the original scene, barring effects introduced during compression.</td><td>The higher the resolution of a video, the larger it gets. This plays a key role in the final size of the video.</td></tr>"
type: "html"
value: "<tr><th scope=\"row\">Feature</th><th scope=\"col\">Effect on quality</th><th scope=\"col\">Effect on size</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Lossless compression</th><td>No loss of quality</td><td>Lossless compression cannot reduce the overall video size nearly as much as lossy compression; the resulting files are likely to still be too large for general usage.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Lossy compression</th><td>To some degree, artifacts and other forms of quality degradation wil occur, depending on the specific codec and how much compression is being applied</td><td>The more the encoded video is allowed to deviate from the source, the easier it is to accomplish higher compression rates</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Quality setting</th><td>The higher the quality configuration, the more like the original media the encoded video will look</td><td>In general, higher quality settings will result in larger encoded video files; the degree to which this is true varies depending on the codec</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Bit rate</th><td>Quality generally improves with higher bit rates</td><td>Higher bit rates inherently lead to larger output files</td></tr>"
tr (214:3) => tableRow
type: "html"
value: "<td><h4 id=\"Moiré_patterns\">Moiré patterns</h4><p>A <a href=\"https://en.wikipedia.org/wiki/Moir%C3%A9_pattern\"><strong>Moiré pattern</strong></a> is a large-scale spatial interference pattern produced when a pattern in the source image and the manner in which the encoder operates are slightly out of alignment spatially. The artifacts generated by the encoder then introduce strange, swirling effects in the source image's pattern upon decoding.</p></td>",type: "html"
value: "<td><a href=\"moire-pattern.jpg\"><img alt=\"\" src=\"moire-pattern.jpg\"></a></td>"
td (223:4) => tableCell
type: "heading"
depth: 4
children:
type: "text"
value: "Staircase effect",type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "text"
value: "The "
type: "strong"
children:
type: "text"
value: "staircase effect"
type: "text"
value: " is a spatial artifact that occurs when diagonal straight or curved edges that should be smooth take on a jagged appearance, looking somewhat like a set of stair steps. This is the effect that is being reduced by \"anti-aliasing\" filters."
tr (222:3) => tableRow
type: "html"
value: "<td><h4 id=\"Staircase_effect\">Staircase effect</h4><p>The <strong>staircase effect</strong> is a spatial artifact that occurs when diagonal straight or curved edges that should be smooth take on a jagged appearance, looking somewhat like a set of stair steps. This is the effect that is being reduced by \"anti-aliasing\" filters.</p></td>"
td (231:4) => tableCell
type: "heading"
depth: 4
children:
type: "text"
value: "Wagon-wheel effect",type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "The "
type: "strong"
children:
type: "text"
value: "wagon-wheel effect"
type: "text"
value: " (or "
type: "strong"
children:
type: "text"
value: "{{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAic3Ryb2Jvc2NvcGljIGVmZmVjdCIp}}"
type: "text"
value: ") is the visual effect that's commonly seen in film, in which a turning wheel appears to rotate at the wrong speed, or even in reverse, due to an interaction between the frame rate and the compression algorithm. The same effect can occur with any repeating pattern that moves, such as the ties on a railway line, posts along the side of a road, and so forth. This is a temporal (time-based) aliasing issue; the speed of the rotation interferes with the frequency of the sampling performed during compression or encoding."
tr (230:3) => tableRow
type: "html"
value: "<td><h4 id=\"Wagon-wheel_effect\">Wagon-wheel effect</h4><p>The <strong>wagon-wheel effect</strong> (or <strong>{{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAic3Ryb2Jvc2NvcGljIGVmZmVjdCIp}}</strong>) is the visual effect that's commonly seen in film, in which a turning wheel appears to rotate at the wrong speed, or even in reverse, due to an interaction between the frame rate and the compression algorithm. The same effect can occur with any repeating pattern that moves, such as the ties on a railway line, posts along the side of a road, and so forth. This is a temporal (time-based) aliasing issue; the speed of the rotation interferes with the frequency of the sampling performed during compression or encoding.</p></td>"
table.standard-table (212:1) => table
type: "html"
value: "<tr><td><h4 id=\"Moiré_patterns\">Moiré patterns</h4><p>A <a href=\"https://en.wikipedia.org/wiki/Moir%C3%A9_pattern\"><strong>Moiré pattern</strong></a> is a large-scale spatial interference pattern produced when a pattern in the source image and the manner in which the encoder operates are slightly out of alignment spatially. The artifacts generated by the encoder then introduce strange, swirling effects in the source image's pattern upon decoding.</p></td><td><a href=\"moire-pattern.jpg\"><img alt=\"\" src=\"moire-pattern.jpg\"></a></td></tr>",type: "html"
value: "<tr><td><h4 id=\"Staircase_effect\">Staircase effect</h4><p>The <strong>staircase effect</strong> is a spatial artifact that occurs when diagonal straight or curved edges that should be smooth take on a jagged appearance, looking somewhat like a set of stair steps. This is the effect that is being reduced by \"anti-aliasing\" filters.</p></td><td><a href=\"staircase-effect.jpg\"><img alt=\"\" src=\"staircase-effect.jpg\"></a></td></tr>",type: "html"
value: "<tr><td><h4 id=\"Wagon-wheel_effect\">Wagon-wheel effect</h4><p>The <strong>wagon-wheel effect</strong> (or <strong>{{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAic3Ryb2Jvc2NvcGljIGVmZmVjdCIp}}</strong>) is the visual effect that's commonly seen in film, in which a turning wheel appears to rotate at the wrong speed, or even in reverse, due to an interaction between the frame rate and the compression algorithm. The same effect can occur with any repeating pattern that moves, such as the ties on a railway line, posts along the side of a road, and so forth. This is a temporal (time-based) aliasing issue; the speed of the rotation interferes with the frequency of the sampling performed during compression or encoding.</p></td><td><a href=\"stroboscopic-effect.gif\"><img alt=\"\" src=\"stroboscopic-effect.gif\"></a></td></tr>"
type: "html"
value: "<td style=\"vertical-align: top;\">The first full frame as seen by the viewer.</td>",type: "html"
value: "<td style=\"vertical-align: top;\">Here, only the differences between the first frame and the following frame are seen. Everything else is black. Looking closely, we can see that the majority of these differences come from a horizontal camera move, making this a good candidate for motion compensation.</td>",type: "html"
value: "<td style=\"vertical-align: top;\">To minimize the number of pixels that are different, here we take into account the panning of the camera by first shifting the first frame to the right by two pixels, then by taking the difference. This compensates for the panning of the camera, allowing for more overlap between the two frames.</td>"
type: "html"
value: "<tr><th scope=\"col\" style=\"width: 216px;\">Original frame</th><th scope=\"col\" style=\"width: 216px;\">Inter-frame differences</th><th scope=\"col\" style=\"width: 216px;\">Difference after motion compensation</th></tr>",type: "html"
value: "<tr><td style=\"vertical-align: top;\">The first full frame as seen by the viewer.</td><td style=\"vertical-align: top;\">Here, only the differences between the first frame and the following frame are seen. Everything else is black. Looking closely, we can see that the majority of these differences come from a horizontal camera move, making this a good candidate for motion compensation.</td><td style=\"vertical-align: top;\">To minimize the number of pixels that are different, here we take into account the panning of the camera by first shifting the first frame to the right by two pixels, then by taking the difference. This compensates for the panning of the camera, allowing for more overlap between the two frames.</td></tr>",type: "html"
value: "<tr><th colspan=\"3\" style=\"font: italic 0.9em Arial, x-locale-body, sans-serif; vertical-align: middle;\">Images from <a href=\"https://en.wikipedia.org/wiki/Motion_compensation#Illustrated_example\">Wikipedia</a></th></tr>"
tr (350:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td><p>Varies depending on the video's level; theoretical maximum reaches 800 Mbps at level 6.3</p><p>See the AV1 specification's <a href=\"https://aomediacodec.github.io/av1-spec/#levels\">tables of levels</a>, which describe the maximum resolutions and rates at each level.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td><p>Varies depending on the video's level; theoretical maximum reaches 800 Mbps at level 6.3</p><p>See the AV1 specification's <a href=\"https://aomediacodec.github.io/av1-spec/#levels\">tables of levels</a>, which describe the maximum resolutions and rates at each level.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame rates</th><td>Varies by level; for example, level 2.0 has a maximum of 30 FPS while level 6.3 can reach 120 FPS</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy <a href=\"https://en.wikipedia.org/wiki/Discrete_cosine_transform\">DCT-based algorithm</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame sizes</th><td>8 x 8 pixels to 65,535 x 65535 pixels with each dimension allowed to take any value between these</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><table class=\"standard-table\"><thead><tr><th scope=\"row\">Profile</th><th scope=\"col\">Color depths</th><th scope=\"col\">Chroma subsampling</th></tr></thead><tbody><tr><th scope=\"row\">Main</th><td>8 or 10</td><td>4:0:0 (greyscale) or 4:2:0</td></tr><tr><th scope=\"row\">High</th><td>8 or 10</td><td>4:0:0 (greyscale), 4:2:0, or 4:4:4</td></tr><tr><th scope=\"row\">Professional</th><td>8, 10, or 12</td><td>4:0:0 (greyscale), 4:2:0, 4:2:2, or 4:4:4</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">HDR support</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Frame Rate (VFR) support</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">AV1 support</th><td>70</td><td>75</td><td>67</td><td>No</td><td>57</td><td>No</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td><a href=\"https://en.wikipedia.org/wiki/ISO/IEC_base_media_file_format\">ISOBMFF</a>, MPEG-TS, <a href=\"/en-US/docs/Web/Media/Formats/Containers#mp4\">MP4</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#webm\">WebM</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supporting/Maintaining organization</th><td><a href=\"https://aomedia.org/\">Alliance for Open Media</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><a href=\"https://aomediacodec.github.io/av1-spec/av1-spec.pdf\">https://aomediacodec.github.io/av1-spec/av1-spec.pdf</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Royalty-free, open standard</td></tr>"
tr (474:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>Varies by level</td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "text"
value: "Some of the more common or interesting profiles:"
tr (490:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>",type: "html"
value: "<td><p>Some of the more common or interesting profiles:</p><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Profile</th><th scope=\"col\">Color depths</th><th scope=\"col\">Chroma subsampling</th></tr><tr><td>Constrained Baseline (CBP)</td><td>8</td><td>4:2:0</td></tr><tr><td>Baseline (BP)</td><td>8</td><td>4:2:0</td></tr><tr><td>Extended (XP)</td><td>8</td><td>4:2:0</td></tr><tr><td>Main (MP)</td><td>8</td><td>4:2:0</td></tr><tr><td>High (HiP)</td><td>8</td><td>4:0:0 (greyscale) and 4:2:0</td></tr><tr><td>Progressive High (ProHiP)</td><td>8</td><td>4:0:0 (greyscale) and 4:2:0</td></tr><tr><td>High 10 (Hi10P)</td><td>8 to 10</td><td>4:0:0 (greyscale) and 4:2:0</td></tr><tr><td>High 4:2:2 (Hi422P)</td><td>8 to 10</td><td>4:0:0 (greyscale), 4:2:0, and 4:2:2</td></tr><tr><td>High 4:4:4 Predictive</td><td>8 to 14</td><td>4:0:0 (greyscale), 4:2:0, 4:2:2, and 4:4:4</td></tr></tbody></table></td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Firefox support for AVC is dependent upon the operating system's built-in or preinstalled codecs for AVC and its container in order to avoid patent concerns."
tr (559:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">AVC/H.264 support</th><td>4</td><td>12</td><td>35</td><td>9</td><td>25</td><td>3.2</td></tr></tbody></table><p>Firefox support for AVC is dependent upon the operating system's built-in or preinstalled codecs for AVC and its container in order to avoid patent concerns.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td>Varies by level</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame rates</th><td>Varies by level; up to 300 FPS is possible</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy <a href=\"https://en.wikipedia.org/wiki/Discrete_cosine_transform\">DCT-based algorithm</a>, though it's possible to create lossless macroblocks within the image</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame sizes</th><td>Up to 8,192 x 4,320 pixels</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><p>Some of the more common or interesting profiles:</p><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Profile</th><th scope=\"col\">Color depths</th><th scope=\"col\">Chroma subsampling</th></tr><tr><td>Constrained Baseline (CBP)</td><td>8</td><td>4:2:0</td></tr><tr><td>Baseline (BP)</td><td>8</td><td>4:2:0</td></tr><tr><td>Extended (XP)</td><td>8</td><td>4:2:0</td></tr><tr><td>Main (MP)</td><td>8</td><td>4:2:0</td></tr><tr><td>High (HiP)</td><td>8</td><td>4:0:0 (greyscale) and 4:2:0</td></tr><tr><td>Progressive High (ProHiP)</td><td>8</td><td>4:0:0 (greyscale) and 4:2:0</td></tr><tr><td>High 10 (Hi10P)</td><td>8 to 10</td><td>4:0:0 (greyscale) and 4:2:0</td></tr><tr><td>High 4:2:2 (Hi422P)</td><td>8 to 10</td><td>4:0:0 (greyscale), 4:2:0, and 4:2:2</td></tr><tr><td>High 4:4:4 Predictive</td><td>8 to 14</td><td>4:0:0 (greyscale), 4:2:0, 4:2:2, and 4:4:4</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">HDR support</th><td>Yes; {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiSHlicmlkIExvZy1HYW1tYSIp}} or Advanced HDR/SL-HDR; both are part of ATSC</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Frame Rate (VFR) support</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">AVC/H.264 support</th><td>4</td><td>12</td><td>35</td><td>9</td><td>25</td><td>3.2</td></tr></tbody></table><p>Firefox support for AVC is dependent upon the operating system's built-in or preinstalled codecs for AVC and its container in order to avoid patent concerns.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td><a href=\"/en-US/docs/Web/Media/Formats/Containers#3gp\">3GP</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#mp4\">MP4</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supporting/Maintaining organization</th><td><a href=\"https://mpeg.chiariglione.org/\">MPEG</a> / <a href=\"https://www.itu.int/\">ITU</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><a href=\"https://mpeg.chiariglione.org/standards/mpeg-4/advanced-video-coding\">https://mpeg.chiariglione.org/standards/mpeg-4/advanced-video-coding</a><br><a href=\"https://www.itu.int/rec/T-REC-H.264\">https://www.itu.int/rec/T-REC-H.264</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Proprietary with numerous patents. Commercial use <a href=\"https://www.mpegla.com/programs/avc-h-264/\">requires a license</a>. Note that multiple patent pools may apply.</td></tr>"
tr (625:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>Unrestricted, but typically below 64 Kbps</td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "text"
value: "Up to 1408 x 1152 pixels.",type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "text"
value: "Version 1 of H.263 specifies a set of picture sizes which are supported. Later versions may support additional resolutions."
tr (637:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported frame sizes</th>",type: "html"
value: "<td><p>Up to 1408 x 1152 pixels.</p><p>Version 1 of H.263 specifies a set of picture sizes which are supported. Later versions may support additional resolutions.</p></td>"
tr (643:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td>Unrestricted, but typically below 64 Kbps</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame rates</th><td>Any</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy <a href=\"https://en.wikipedia.org/wiki/Discrete_cosine_transform\">DCT-based algorithm</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame sizes</th><td><p>Up to 1408 x 1152 pixels.</p><p>Version 1 of H.263 specifies a set of picture sizes which are supported. Later versions may support additional resolutions.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td>YCbCr; each picture format (sub-QCIF, QCIF, CIF, 4CIF, or 16CIF) defines the frame size in pixels as well as how many rows each of luminance and chrominance samples are used for each frame</td></tr>",type: "html"
value: "<tr><th scope=\"row\">HDR support</th><td>No</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Frame Rate (VFR) support</th><td>No</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">H.263 support</th><td>No</td><td>No</td><td>No</td><td>No</td><td>No</td><td>No</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td><a href=\"/en-US/docs/Web/Media/Formats/Containers#3gp\">3GP</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#mp4\">MP4</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#quicktime\">QuickTime</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>No</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supporting/Maintaining organization</th><td><a href=\"https://www.itu.net/\">ITU</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><a href=\"https://www.itu.int/rec/T-REC-H.263/\">https://www.itu.int/rec/T-REC-H.263/</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Proprietary; appropriate license or licenses are required. Note that multiple patent pools may apply.</td></tr>"
tr (717:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>Up to 800,000 Kbps</td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "text"
value: "Information below is provided for the major profiles. There are a number of other profiles available that are not included here.",type: "table"
children:
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 0
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Profile"
type: "tableCell"
children:
type: "text"
value: "Color depths"
type: "tableCell"
children:
type: "text"
value: "Chroma subsampling"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 1
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main"
type: "tableCell"
children:
type: "text"
value: "8"
type: "tableCell"
children:
type: "text"
value: "4:2:0"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main 10"
type: "tableCell"
children:
type: "text"
value: "8 to 10"
type: "tableCell"
children:
type: "text"
value: "4:2:0"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 3
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main 12"
type: "tableCell"
children:
type: "text"
value: "8 to 12"
type: "tableCell"
children:
type: "text"
value: "4:0:0 and 4:2:0"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main 4:2:2 10"
type: "tableCell"
children:
type: "text"
value: "8 to 10"
type: "tableCell"
children:
type: "text"
value: "4:0:0, 4:2:0, and 4:2:2"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 5
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main 4:2:2 12"
type: "tableCell"
children:
type: "text"
value: "8 to 12"
type: "tableCell"
children:
type: "text"
value: "4:0:0, 4:2:0, and 4:2:2"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main 4:4:4"
type: "tableCell"
children:
type: "text"
value: "8"
type: "tableCell"
children:
type: "text"
value: "4:0:0, 4:2:0, 4:2:2, and 4:4:4"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main 4:4:4 10"
type: "tableCell"
children:
type: "text"
value: "8 to 10"
type: "tableCell"
children:
type: "text"
value: "4:0:0, 4:2:0, 4:2:2, and 4:4:4"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 8
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main 4:4:4 12"
type: "tableCell"
children:
type: "text"
value: "8 to 12"
type: "tableCell"
children:
type: "text"
value: "4:0:0, 4:2:0, 4:2:2, and 4:4:4"
type: "tableRow"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 9
shouldWrap: true
children:
type: "tableCell"
children:
type: "text"
value: "Main 4:4:4 16 Intra"
type: "tableCell"
children:
type: "text"
value: "8 to 16"
type: "tableCell"
children:
type: "text"
value: "4:0:0, 4:2:0, 4:2:2, and 4:4:4"
tr (733:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>",type: "html"
value: "<td><p>Information below is provided for the major profiles. There are a number of other profiles available that are not included here.</p><table class=\"standard-table\"><thead><tr><th scope=\"col\">Profile</th><th scope=\"col\">Color depths</th><th scope=\"col\">Chroma subsampling</th></tr></thead><tbody><tr><td>Main</td><td>8</td><td>4:2:0</td></tr><tr><td>Main 10</td><td>8 to 10</td><td>4:2:0</td></tr><tr><td>Main 12</td><td>8 to 12</td><td>4:0:0 and 4:2:0</td></tr><tr><td>Main 4:2:2 10</td><td>8 to 10</td><td>4:0:0, 4:2:0, and 4:2:2</td></tr><tr><td>Main 4:2:2 12</td><td>8 to 12</td><td>4:0:0, 4:2:0, and 4:2:2</td></tr><tr><td>Main 4:4:4</td><td>8</td><td>4:0:0, 4:2:0, 4:2:2, and 4:4:4</td></tr><tr><td>Main 4:4:4 10</td><td>8 to 10</td><td>4:0:0, 4:2:0, 4:2:2, and 4:4:4</td></tr><tr><td>Main 4:4:4 12</td><td>8 to 12</td><td>4:0:0, 4:2:0, 4:2:2, and 4:4:4</td></tr><tr><td>Main 4:4:4 16 Intra</td><td>8 to 16</td><td>4:0:0, 4:2:0, 4:2:2, and 4:4:4</td></tr></tbody></table></td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Internet Explorer and Edge only supports HEVC on devices with a hardware codec.",type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Mozilla will not support HEVC while it is encumbered by patents."
tr (804:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">HEVC / H.265 support</th><td>No</td><td>18</td><td>No</td><td>11</td><td>No</td><td>11</td></tr></tbody></table><p>Internet Explorer and Edge only supports HEVC on devices with a hardware codec.</p><p>Mozilla will not support HEVC while it is encumbered by patents.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td>Up to 800,000 Kbps</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame rates</th><td>Varies by level; up to 300 FPS is possible</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy <a href=\"https://en.wikipedia.org/wiki/Discrete_cosine_transform\">DCT-based algorithm</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame sizes</th><td>128 x 96 to 8,192 x 4,320 pixels; varies by profile and level</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td><p>Information below is provided for the major profiles. There are a number of other profiles available that are not included here.</p><table class=\"standard-table\"><thead><tr><th scope=\"col\">Profile</th><th scope=\"col\">Color depths</th><th scope=\"col\">Chroma subsampling</th></tr></thead><tbody><tr><td>Main</td><td>8</td><td>4:2:0</td></tr><tr><td>Main 10</td><td>8 to 10</td><td>4:2:0</td></tr><tr><td>Main 12</td><td>8 to 12</td><td>4:0:0 and 4:2:0</td></tr><tr><td>Main 4:2:2 10</td><td>8 to 10</td><td>4:0:0, 4:2:0, and 4:2:2</td></tr><tr><td>Main 4:2:2 12</td><td>8 to 12</td><td>4:0:0, 4:2:0, and 4:2:2</td></tr><tr><td>Main 4:4:4</td><td>8</td><td>4:0:0, 4:2:0, 4:2:2, and 4:4:4</td></tr><tr><td>Main 4:4:4 10</td><td>8 to 10</td><td>4:0:0, 4:2:0, 4:2:2, and 4:4:4</td></tr><tr><td>Main 4:4:4 12</td><td>8 to 12</td><td>4:0:0, 4:2:0, 4:2:2, and 4:4:4</td></tr><tr><td>Main 4:4:4 16 Intra</td><td>8 to 16</td><td>4:0:0, 4:2:0, 4:2:2, and 4:4:4</td></tr></tbody></table></td></tr>",type: "html"
value: "<tr><th scope=\"row\">HDR support</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Frame Rate (VFR) support</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">HEVC / H.265 support</th><td>No</td><td>18</td><td>No</td><td>11</td><td>No</td><td>11</td></tr></tbody></table><p>Internet Explorer and Edge only supports HEVC on devices with a hardware codec.</p><p>Mozilla will not support HEVC while it is encumbered by patents.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td><a href=\"/en-US/docs/Web/Media/Formats/Containers#mp4\">MP4</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>No</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supporting/Maintaining organization</th><td><a href=\"https://www.itu.net/\">ITU</a> / <a href=\"https://mpeg.chiariglione.org/\">MPEG</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specifications</th><td><a href=\"https://www.itu.int/rec/T-REC-H.265\">http://www.itu.int/rec/T-REC-H.265</a><br><a href=\"https://www.iso.org/standard/69668.html\">https://www.iso.org/standard/69668.html</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Proprietary; confirm your compliance with the <a href=\"https://www.mpegla.com/programs/hevc/\">licensing requirements</a>. Note that multiple patent pools may apply.</td></tr>"
tr (868:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>5 Kbps to 1 Gbps and more</td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Firefox supports MP4V-ES in "
type: "link"
title:
url: "/en-US/docs/Web/Media/Formats/Containers#3gp"
children:
type: "text"
value: "3GP"
type: "text"
value: " containers only.",type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Chrome does not support MP4V-ES; however, Chrome OS does."
tr (896:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">MP4V-ES support</th><td>No</td><td>No</td><td>Yes</td><td>No</td><td>No</td><td>No</td></tr></tbody></table><p>Firefox supports MP4V-ES in <a href=\"/en-US/docs/Web/Media/Formats/Containers#3gp\">3GP</a> containers only.</p><p>Chrome does not support MP4V-ES; however, Chrome OS does.</p></td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "text"
value: "Yes",type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 6
shouldWrap: true
children:
type: "text"
value: "While Theora doesn't support Variable Frame Rate (VFR) within a single stream, multiple streams can be chained together within a single file, and each of those can have its own frame rate, thus allowing what is essentially VFR. However, this is impractical if the frame rate needs to change frequently."
tr (1224:3) => tableRow
type: "html"
value: "<th scope=\"row\">Variable Frame Rate (VFR) support</th>",type: "html"
value: "<td><p>Yes</p><p>While Theora doesn't support Variable Frame Rate (VFR) within a single stream, multiple streams can be chained together within a single file, and each of those can have its own frame rate, thus allowing what is essentially VFR. However, this is impractical if the frame rate needs to change frequently.</p></td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Edge supports Theora with the optional "
type: "link"
title:
url: "https://www.microsoft.com/en-us/p/web-media-extensions/9n5tdp8vcmhs?activetab=pivot:overviewtab"
children:
type: "text"
value: "Web Media Extensions"
type: "text"
value: " add-on."
tr (1230:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">Theora support</th><td>3</td><td>Yes</td><td>3.5</td><td>No</td><td>10.5</td><td>No</td></tr></tbody></table><p>Edge supports Theora with the optional <a href=\"https://www.microsoft.com/en-us/p/web-media-extensions/9n5tdp8vcmhs?activetab=pivot:overviewtab\">Web Media Extensions</a> add-on.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td>Up to 2 Gbps</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame rates</th><td>Arbitrary; any non-zero value is supported. The frame rate is specified as a 32-bit numerator and a 32-bit denominator, to allow for non-integer frame rates.</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy <a href=\"https://en.wikipedia.org/wiki/Discrete_cosine_transform\">DCT-based algorithm</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame sizes</th><td>Any combination of width and height up to 1,048,560 x 1,048,560 pixels</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td>Y'CbCr with 4:2:0, 4:2:2, and 4:4:4 chroma subsampling at 8 bits per component</td></tr>",type: "html"
value: "<tr><th scope=\"row\">HDR support</th><td>No</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Frame Rate (VFR) support</th><td><p>Yes</p><p>While Theora doesn't support Variable Frame Rate (VFR) within a single stream, multiple streams can be chained together within a single file, and each of those can have its own frame rate, thus allowing what is essentially VFR. However, this is impractical if the frame rate needs to change frequently.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">Theora support</th><td>3</td><td>Yes</td><td>3.5</td><td>No</td><td>10.5</td><td>No</td></tr></tbody></table><p>Edge supports Theora with the optional <a href=\"https://www.microsoft.com/en-us/p/web-media-extensions/9n5tdp8vcmhs?activetab=pivot:overviewtab\">Web Media Extensions</a> add-on.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td><a href=\"/en-US/docs/Web/Media/Formats/Containers#ogg\">Ogg</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>No</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supporting/Maintaining organization</th><td><a href=\"https://www.xiph.org/\">Xiph.org</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td><a href=\"https://www.theora.org/doc/\">https://www.theora.org/doc/</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Open and free of royalties and any other licensing requirements</td></tr>"
tr (1291:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>Arbitrary; no maximum unless level-based limitations are enforced</td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Edge support for VP8 requires the use of "
type: "link"
title:
url: "/en-US/docs/Web/API/Media_Source_Extensions_API"
children:
type: "text"
value: "Media Source Extensions"
type: "text"
value: ".",type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Safari only supports VP8 in WebRTC connections.",type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Firefox only supports VP8 in MSE when no H.264 hardware decoder is available. Use {{ZG9teHJlZigiTWVkaWFTb3VyY2UuaXNUeXBlU3VwcG9ydGVkKCkiKQ==}} to check for availability."
tr (1319:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">VP8 support</th><td>25</td><td>14</td><td>4</td><td>9</td><td>16</td><td>12.1</td></tr><tr><th scope=\"row\">MSE compatibility</th><td></td><td></td><td>Yes</td><td></td><td></td><td></td></tr></tbody></table><p>Edge support for VP8 requires the use of <a href=\"/en-US/docs/Web/API/Media_Source_Extensions_API\">Media Source Extensions</a>.</p><p>Safari only supports VP8 in WebRTC connections.</p><p>Firefox only supports VP8 in MSE when no H.264 hardware decoder is available. Use {{ZG9teHJlZigiTWVkaWFTb3VyY2UuaXNUeXBlU3VwcG9ydGVkKCkiKQ==}} to check for availability.</p></td>"
type: "html"
value: "<tr><th scope=\"row\">Supported bit rates</th><td>Arbitrary; no maximum unless level-based limitations are enforced</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame rates</th><td>Arbitrary</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Compression</th><td>Lossy <a href=\"https://en.wikipedia.org/wiki/Discrete_cosine_transform\">DCT-based algorithm</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported frame sizes</th><td>Up to 16,384 x 16,384 pixels</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supported color modes</th><td>Y'CbCr with 4:2:0 chroma subsampling at 8 bits per component</td></tr>",type: "html"
value: "<tr><th scope=\"row\">HDR support</th><td>No</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Variable Frame Rate (VFR) support</th><td>Yes</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Browser compatibility</th><td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">VP8 support</th><td>25</td><td>14</td><td>4</td><td>9</td><td>16</td><td>12.1</td></tr><tr><th scope=\"row\">MSE compatibility</th><td></td><td></td><td>Yes</td><td></td><td></td><td></td></tr></tbody></table><p>Edge support for VP8 requires the use of <a href=\"/en-US/docs/Web/API/Media_Source_Extensions_API\">Media Source Extensions</a>.</p><p>Safari only supports VP8 in WebRTC connections.</p><p>Firefox only supports VP8 in MSE when no H.264 hardware decoder is available. Use {{ZG9teHJlZigiTWVkaWFTb3VyY2UuaXNUeXBlU3VwcG9ydGVkKCkiKQ==}} to check for availability.</p></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Container support</th><td><a href=\"/en-US/docs/Web/Media/Formats/Containers#3gp\">3GP</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#ogg\">Ogg</a>, <a href=\"/en-US/docs/Web/Media/Formats/Containers#webm\">WebM</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{R2xvc3NhcnkoIlJUUCIp}} / <a href=\"/en-US/docs/Web/API/WebRTC_API\">WebRTC</a> compatible</th><td>Yes; VP8 is one of the spec-required codecs for WebRTC</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Supporting/Maintaining organization</th><td><a href=\"https://www.google.com/\">Google</a></td></tr>",type: "html"
value: "<tr><th scope=\"row\">Specification</th><td>{{UkZDKDYzODYp}}</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Licensing</th><td>Open and free of royalties and any other licensing requirements</td></tr>"
tr (1397:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported bit rates</th>",type: "html"
value: "<td>Arbitrary; no maximum unless level-based limitations are enforced</td>"
type: "html"
value: "<tr><th scope=\"row\">Profile</th><th scope=\"col\">Color depths</th><th scope=\"col\">Chroma subsampling</th></tr>",type: "html"
value: "<tr><th scope=\"row\">Profile 0</th><td>8</td><td>4:2:0</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Profile 1</th><td>8</td><td>4:2:0, 4:2:2, and 4:4:4</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Profile 2</th><td>10 to 12</td><td>4:2:0</td></tr>",type: "html"
value: "<tr><th scope=\"row\">Profile 3</th><td>10 to 12</td><td>4:2:0, 4:2:2, and f:4:4</td></tr>"
td (1415:4) => tableCell
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 4
shouldWrap: true
children:
type: "text"
value: "Color spaces supported: {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiUmVjLiA2MDEiKQ==}}, {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiUmVjLiA3MDkiKQ==}}, {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiUmVjLiAyMDIwIik=}}, {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiU01QVEUgQyIp}}, SMPTE-240M (obsolete; replaced by Rec. 709), and {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAic1JHQiIp}}."
tr (1413:3) => tableRow
type: "html"
value: "<th scope=\"row\">Supported color modes</th>",type: "html"
value: "<td><table class=\"standard-table\"><thead><tr><th scope=\"row\">Profile</th><th scope=\"col\">Color depths</th><th scope=\"col\">Chroma subsampling</th></tr></thead><tbody><tr><th scope=\"row\">Profile 0</th><td>8</td><td>4:2:0</td></tr><tr><th scope=\"row\">Profile 1</th><td>8</td><td>4:2:0, 4:2:2, and 4:4:4</td></tr><tr><th scope=\"row\">Profile 2</th><td>10 to 12</td><td>4:2:0</td></tr><tr><th scope=\"row\">Profile 3</th><td>10 to 12</td><td>4:2:0, 4:2:2, and f:4:4</td></tr></tbody></table><p>Color spaces supported: {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiUmVjLiA2MDEiKQ==}}, {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiUmVjLiA3MDkiKQ==}}, {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiUmVjLiAyMDIwIik=}}, {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAiU01QVEUgQyIp}}, SMPTE-240M (obsolete; replaced by Rec. 709), and {{aW50ZXJ3aWtpKCJ3aWtpcGVkaWEiLCAic1JHQiIp}}.</p></td>"
type: "paragraph"
summary: "This guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video."
locale: "en-US"
rowIndex: 7
shouldWrap: true
children:
type: "text"
value: "Firefox only supports VP8 in MSE when no H.264 hardware decoder is available. Use {{ZG9teHJlZigiTWVkaWFTb3VyY2UuaXNUeXBlU3VwcG9ydGVkKCkiKQ==}} to check for availability."
tr (1459:3) => tableRow
type: "html"
value: "<th scope=\"row\">Browser compatibility</th>",type: "html"
value: "<td><table class=\"standard-table\"><tbody><tr><th scope=\"row\">Feature</th><th scope=\"col\">Chrome</th><th scope=\"col\">Edge</th><th scope=\"col\">Firefox</th><th scope=\"col\">Internet Explorer</th><th scope=\"col\">Opera</th><th scope=\"col\">Safari</th></tr><tr><th scope=\"row\">VP9 support</th><td>29</td><td>14</td><td>28</td><td>No</td><td>10.6</td><td>No</td></tr><tr><th scope=\"row\">MSE compatibility</th><td></td><td></td><td>Yes</td><td></td><td></td><td></td></tr></tbody></table><p>Firefox only supports VP8 in MSE when no H.264 hardware decoder is available. Use {{ZG9teHJlZigiTWVkaWFTb3VyY2UuaXNUeXBlU3VwcG9ydGVkKCkiKQ==}} to check for availability.</p></td>"
type: "paragraph"
summary: "This guide reviews the codecs that browsers are required to implement as well as other codecs that some or all browsers support for WebRTC."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Chrome (52+), Edge, Firefox, Safari",type: "paragraph"
summary: "This guide reviews the codecs that browsers are required to implement as well as other codecs that some or all browsers support for WebRTC."
locale: "en-US"
rowIndex: 2
shouldWrap: true
children:
type: "text"
value: "Firefox for Android 68 and later do not support AVC (H.264) anymore. This is due to a change in Google Play store requirements that prevent Firefox from downloading and installing the OpenH264 codec needed to handle H.264 in WebRTC connections. See "
type: "link"
title:
url: "https://support.mozilla.org/en-US/kb/firefox-android-openh264"
children:
type: "text"
value: "this article on SUMO"
type: "text"
value: " for details."
tr (56:3) => tableRow
type: "html"
value: "<th scope=\"row\">{{YW5jaCgiQVZDIiwgIkFWQyAvIEguMjY0Iik=}}</th>",type: "html"
value: "<td><p>Chrome (52+), Edge, Firefox, Safari</p><p>Firefox for Android 68 and later do not support AVC (H.264) anymore. This is due to a change in Google Play store requirements that prevent Firefox from downloading and installing the OpenH264 codec needed to handle H.264 in WebRTC connections. See <a href=\"https://support.mozilla.org/en-US/kb/firefox-android-openh264\">this article on SUMO</a> for details.</p></td>"
table.standard-table (41:1) => table
type: "html"
value: "<tr><th scope=\"row\">Codec name</th><th scope=\"col\">Profile(s)</th><th scope=\"col\">Browser compatibility</th></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiVlA4Iik=}}</th><td>—</td><td>Chrome, Edge, Firefox, Safari (12.1+)</td></tr>",type: "html"
value: "<tr><th scope=\"row\">{{YW5jaCgiQVZDIiwgIkFWQyAvIEguMjY0Iik=}}</th><td>Constrained Baseline (CB)</td><td><p>Chrome (52+), Edge, Firefox, Safari</p><p>Firefox for Android 68 and later do not support AVC (H.264) anymore. This is due to a change in Google Play store requirements that prevent Firefox from downloading and installing the OpenH264 codec needed to handle H.264 in WebRTC connections. See <a href=\"https://support.mozilla.org/en-US/kb/firefox-android-openh264\">this article on SUMO</a> for details.</p></td></tr>"