--- link: "" --- The [built-in browser `` component](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link) lets you use external resources such as stylesheets or annotate the document with link metadata. ```js ``` --- ## Reference {/*reference*/} ### `` {/*link*/} To link to external resources such as stylesheets, fonts, and icons, or to annotate the document with link metadata, render the [built-in browser `` component](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link). You can render `` from any component and React will [in most cases](#special-rendering-behavior) place the corresponding DOM element in the document head. ```js ``` [See more examples below.](#usage) #### Props {/*props*/} `` supports all [common element props.](/reference/react-dom/components/common#common-props) * `rel`: a string, required. Specifies the [relationship to the resource](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel). React [treats links with `rel="stylesheet"` differently](#special-rendering-behavior) from other links. These props apply when `rel="stylesheet"`: * `precedence`: a string. Tells React where to rank the `` DOM node relative to others in the document ``, which determines which stylesheet can override the other. React will infer that precedence values it discovers first are "lower" and precedence values it discovers later are "higher". Many style systems can work fine using a single precedence value because style rules are atomic. Stylesheets with the same precedence go together whether they are `` or inline `