# code-snippets/trunk/css/common/_theme.scss

Code Snippets, version trunk. 82 lines.

- Page: https://pluginprobe.com/plugins/code-snippets/trunk/code/css/common/_theme.scss
- Raw: https://pluginprobe.com/plugins/code-snippets/trunk/raw/css/common/_theme.scss
- Modified: 2026-09-22T07:42:04+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/code-snippets/trunk/code/css/common/_theme.scss#L10-L20`.

```scss
:root {
	--cs-color-accent: #2271b1;
	--cs-color-accent-hover: #0a4b78;
	--cs-color-accent-subtle: #c9e1f5;
	--cs-color-primary: #03c7d2;
	--cs-color-primary-hover: #0ca0a9;
	--cs-color-secondary: #d46f4d;
	--cs-color-text: #2c3337;
	--cs-color-text-secondary: #50575e;
	--cs-color-text-muted: #646970;
	--cs-color-text-subtle: #787c82;
	--cs-color-text-disabled: #a7aaad;
	--cs-color-surface: #fff;
	--cs-color-surface-subtle: #f6f7f7;
	--cs-color-surface-muted: #f0f0f1;
	--cs-color-surface-info: #f0f6fc;
	--cs-color-border: #c3c4c7;
	--cs-color-border-subtle: #dcdcde;
	--cs-color-info: #72aee6;
	--cs-color-success: #00a32a;
	--cs-color-warning: #dba617;
	--cs-color-error: #d63638;
	--cs-cloud-status-public-color: #64baba;
	--cs-cloud-status-private-color: #cc96fb;
	--cs-cloud-status-unverified-color: #ea835e;
	--cs-cloud-status-ai-verified-color: #1cabcf;
	--cs-cloud-status-pro-verified-color: #41a269;
	--cs-tooltip-background-color: rgb(19 18 18 / 90%);
	--cs-toolbar-block-size: 136px;
	--cs-wpcontent-inline-start-indent: 20px;
	--cs-sidebar-width: 320px;
	--cs-sidebar-gap: 30px;
	--cs-card-radius: 8px;
	--cs-control-height: 38px;
	--cs-control-radius: 5px;
	--cs-feedback-modal-inline-size: 460px;
	--cs-preview-modal-inline-size: min(900px, 90vw);
	--cs-preview-modal-inset: 40px;
	--cs-font-size-body: 14px;
	--cs-line-height-body: 1.5;
	--cs-direction-multiplier: 1; // LTR = 1, RTL = -1
}

html[dir="rtl"],
body.rtl {
	--cs-direction-multiplier: -1;
}

/* format: background-color [color] */
$badges: (
	// Badge text colours meet WCAG AA (>= 4.5:1) against their own background.
	// php/html/cond darkened for WCAG AA — at least 4.5:1 against white 12px
	// bold text; php reuses the accent token, html/cond keep hue at reduced lightness.
	php: #2271b1,
	html: #cd4510,
	css: #9b59b6,
	js: #f7d67a #1c1f20,
	cond: #22826f,
	revisions: #50575e,
	core: #4fa1a6,
	pro: #f7e8e3 #df9279,
	cloud: #009fb4,
	bundles: #50575e,
	cloud_search: #d27c00,
	private: #f7e6be #83610f,
	public: #dbebf7 #206ba8,
	success: #d3e8d1 #416e3d,
	failure: #fad7c1 #9c4815,
	info: #d2e6f4 #286896,
	neutral: #f6f7f7 #646970,
	neutralDark: #e2e5e5 #596767,
	special: #dfc5ef #6e249c
);
$notices: (
	success: #d3e9d3 #377a37,
	warning: #f2ebc3 #b0730a,
	error: #f8d7da #721c24,
	info: #d2e6f4 #2b71a3,
	neutral: #e2e5e5 #6c7e7e,
	special: #dfc5ef #6e249c
);

```