---
schema_version: "1"
id: 9df65877cf3a68c19275e721c4c29ec81126bbab63fdcba692659f3d2907ccef
title: Apply Custom Styling to Omniscripts with Static Resources (Managed Package)
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/xcloud/264-0-0/os_apply_custom_styling_to_omniscripts_with_static_resources.md
canonical_url: https://help.salesforce.com/s/articleView?id=xcloud.os_apply_custom_styling_to_omniscripts_with_static_resources.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: e073a0e0da8625e85bdc20f8d3f45ce56c96eb564108bada64c95c1c9db7990b
description: For the managed package runtime, to apply CSS changes to an Omniscript using SLDS or Newport styling, refer to a CSS file static resource in the Styling Options section of the LWC Omniscript Designer. For example, a CSS sheet can change the text color for every Number element in an Omniscript without using a custom Lightning web component to override the Number element.
products:
  - Omnistudio
release: "264"
---
# Apply Custom Styling to Omniscripts with Static Resources (Managed Package)

For the managed package runtime, to apply CSS changes to an Omniscript using SLDS or Newport styling, refer to a CSS file static resource in the Styling Options section of the LWC Omniscript Designer. For example, a CSS sheet can change the text color for every Number element in an Omniscript without using a custom Lightning web component to override the Number element.

![Managed Package app icon](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-xcloud-omnistudio_for_managed_packages-264-0-0-production-enus/aa2554ec-624a-4ee6-8da4-6435670e6e62/resources-global/_corporate/images/managedpackageicon.png) This information is for Omnistudio for Managed Packages. For Omnistudio on standard runtime, see [Omnistudio Help](https://help.salesforce.com/s/articleView?id=xcloud.os_omnistudio_standard.htm&language=en_US).

![Note](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-xcloud-omnistudio_for_managed_packages-264-0-0-production-enus/aa2554ec-624a-4ee6-8da4-6435670e6e62/images/icon_note.png)

Note

Multi-Language Omniscripts provide beta support for right-to-left languages. See [Create Multi-Language Omniscripts (Managed Package)](https://help.salesforce.com/s/articleView?id=xcloud.os_create_multi_language_omniscripts.htm&release=264.0.0&type=5 "For the managed package runtime, allow a single Omniscript to run in multiple languages using Salesforce custom labels.").

1. After you create a custom style sheet, add the CSS file as a static resource.
    
    See [Using Static Resources](https://developer.salesforce.com/docs/atlas.en-us.pages.meta/pages/pages_resources.htm).
    
    For information about styling systems, see [Light DOM](https://lwc.dev/guide/light_dom#implement-scoped-styles), [CSS](https://lwc.dev/guide/css#assign-css-stylesheets-to-a-component-with-the-stylesheets-property), and [Styling Hooks](https://www.lightningdesignsystem.com/platforms/lightning/styling-hooks/).
    
    For example, customstyle.css is uploaded as a static resource named customstyle.
2. In the LWC Omniscript Designer, click **Setup**, and click **Styling Options**.
3. In the **Custom Lightning Stylesheet File Name** or **Custom Newport StyleSheet File Name** field, enter the name of the Static Resource that stores your custom Lightning or Newport styling.
    
    ![An OmniScript's Styling Options section using custom stylesheets.](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-xcloud-omnistudio_for_managed_packages-264-0-0-production-enus/aa2554ec-624a-4ee6-8da4-6435670e6e62/omnistudio_for_managed_packages/images/lwc_os_custom_stylesheets.png)
    
    For example, the static source customstyle refers to the uploaded customstyle.css file.
4. If needed, to add custom styling for right-to-left languages, see [Reference Stylesheet Names in an Omniscript's JSON (Managed Package)](https://help.salesforce.com/s/articleView?id=xcloud.os_reference_stylesheet_names_in_an_omniscript_s_json.htm&release=264.0.0&type=5 "For the managed package runtime, apply CSS changes to an Omniscript using SLDS or Newport styling by referencing a CSS file static resource in your Omniscript's JSON properties. For example, a CSS sheet can change the text color for every Number element in an Omniscript without using custom Lightning web components to override the Number element.").
5. To view your custom styling, activate and preview the Omniscript.
    
    When you preview an Omniscript with a child Omniscript with a custom CSS, the content for the child Omniscript doesn't show the custom styling.