<!--
{
  "documentType" : "article",
  "framework" : "SafariServices",
  "identifier" : "/documentation/SafariServices/injecting-css-style-sheets-into-a-webpage",
  "metadataVersion" : "0.1.0",
  "role" : "article",
  "title" : "Injecting CSS style sheets into a webpage"
}
-->

# Injecting CSS style sheets into a webpage

Add to or override styles by injecting CSS style sheets into webpages.

## Discussion

After you write a style sheet that can modify page presentation, you need to add it to your Safari app extension and apply it to webpages.

A style sheet can apply to a single webpage, all webpages, or only some webpages — for example, webpages from certain domains. To inject your style sheet, you specify either `Some` or `All` website access for your app extension. In Safari 17 or later, users also need to grant your extension access to a website. For more information, see [Adjusting website access permissions](/documentation/SafariServices/adjusting-website-access-permissions). For more information about injected style sheets, see [Using injected style sheets and scripts](/documentation/SafariServices/using-injected-style-sheets-and-scripts).

### Add a style sheet

After specifying website access, add the style sheet to your Safari app extension.

1. Add the CSS files to your extension’s Xcode target.
2. Add an `SFSafariStyleSheet` key to the `NSExtension` element in your extension’s `Info.plist` file. The value for this key is an array of dictionaries.
3. For each CSS file, add a dictionary to this array. Each dictionary must have a `Style Sheet` key with a value that specifies the path (relative to the Resources directory of the bundle) to the style sheet to include.

> Note:
> By default, the system injects a style sheet when the extension has permission to access the webpage. However, you can specify additional dictionary keys to provide more fine-grained control over whether to inject that style sheet into the webpage. For more information, see Access and permissions.

You can have more than one injected style sheet. Style sheets process in the order in which you specify them.

Your style sheet can reference resources in your app extension’s bundle. All relative URLs are relative to the Resources folder in the app extension’s bundle.

---

Copyright &copy; 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)