Global Styling Options
This file defines the global styling tokens used across all Snowpeak resources. It centralizes variables for typography, colors, spacing, borders, shadows, motion, and z‑index.
By changing values in this file, you can customize the look and feel (e.g., brand colors, backgrounds, radius) for all scripts at once.
Please note that a basic amount of CSS styling is necessary. DO NOT CHANGE THE PREFIX OR IT WILL BREAK.
Please note that as updates happen and more variables are added, it is up to you to make sure all those new variables are in place when used with other parts of our resources. Plan accordingly.
Categories
Typography — font families, sizes, line heights
Colors — brand, semantic (success/error/warning/info), backgrounds, surfaces, text
Borders & Radius — border colors, sizes, rounded corners
Spacing — consistent spacing scale
Shadows — elevation levels
Motion — transition speeds and easing curves
Layers — z‑index tokens for overlays, modals, tooltips, etc.
Notes
All values are defined as CSS variables (
--sp-*) at the:rootlevel.Editing this file updates styles globally across every Snowpeak script that consumes it.
Keep changes consistent with your branding/theme to ensure a unified UI.
File
Path:
sp_core/ui/dist/sp_global.cssScope: Global (
:root), applies to all Snowpeak resources.
Last updated