---
title: Config Block Syntax — JS and CSS
description: "## JavaScript ### Delimiters ``` // === BEGIN CONFIG === const formId = 5; let adminUrl = 'https://example.com/wp-admin/'; // === END CONFIG === ``` Block-comment delimiters are also accepted for JavaScript: ``` /* === BEGIN CONFIG === */ const formId…"
url: "https://brightleafdigital.io/docs/config-block-syntax-js-css/"
updated: "2026-10-20"
category: GravityOps Code Snippet Manager / Config Blocks
---

# Config Block Syntax — JS and CSS

## JavaScript

### Delimiters

```
// === BEGIN CONFIG ===
const formId = 5;
let adminUrl = 'https://example.com/wp-admin/';
// === END CONFIG ===
```

Block-comment delimiters are also accepted for JavaScript:

```
/* === BEGIN CONFIG === */
const formId = 5;
/* === END CONFIG === */
```

### Supported declarations

| Kind | Syntax |
| --- | --- |
| `const` | `const name = value;` |
| `let` | `let name = value;` |
| `var` | `var name = value;` |

### Allowed values

Use simple literal-style values. Strings, numbers, booleans, `null`, arrays, and object literals are accepted by the lightweight parser, as long as each declaration fits on one line; a value spread over several lines is rejected. Function calls, control-flow keywords, arrow functions, and template literal expressions are rejected.

### Annotations

```
/** @config int The Gravity Forms form ID to target */
const formId = 5;
```

Same `/** @config <type>[:<params>] <description> */` docblock syntax as PHP. The comment must start with `/**`; a `/* @config */` comment is ignored in JavaScript.

---

## CSS

### Delimiters

```
/* === BEGIN CONFIG === */
:root {
    --brand-color: #975BE5;
    --font-size-base: 16px;
}
/* === END CONFIG === */
```

### Supported declarations

CSS config blocks support **CSS custom properties** (variables) declared inside exactly one CSS rule. Use `:root {}` by convention. The format is `--property-name: value;`.

### Allowed values

CSS values cannot be empty and cannot contain semicolons, braces, `@` rules, or external `http`/`https` `url()` references.

### Annotations

```
:root {
    /* @config color Primary brand color used throughout the form */
    --brand-color: #975BE5;
}
```

Use `/* @config <type>[:<params>] <description> */` or `/** @config … */` on the line above the property. Both comment styles work in CSS.