liquid/example/server/templates/settings.liquid

<style>
  * {
    zoom: 1.1;
    font-family: Menlo;
    color: rgb(13, 13, 13);
  }

  .preview {
    display: flex;
    gap: 2rem;
    margin: 1rem 0;
  }

  .preview > div {
    flex: 1;
  }

  code, pre {
    background: #f5f5f5;
    padding: 0.5rem;
    border-radius: 4px;
    display: block;
  }

  .label {
    font-weight: bold;
    margin-bottom: 0.5rem;
  }
</style>

<h1>let</h1>

<hr>

<div class="preview">
  <div>
    <div class="label">Liquid source</div>
    <pre>
{%- raw -%}
{% assign text = "My text" %}
{{ settings }}
{{ text }}
{%- endraw -%}
    </pre>
  </div>
  <div>
    <div class="label">HTML output</div>
    <pre>
{% assign text = "My text" %}
{{ settings }}
{{ text -}}
    </pre>
  </div>
</div>

<div class="preview">
  <div>
    <div class="label">Liquid source</div>
    <pre>
    {%- raw -%}
{% let (text, font): settings %}
  text: {{ text }},
  font: {{ font }}
{% endlet %}
    {%- endraw -%}
    </pre>
  </div>
  <div>
    <div class="label">HTML output</div>
    <pre>
{%- let (text, font): settings %}
  text: {{ text }},
  font: {{ font }}
{% endlet -%}
    </pre>
  </div>
</div>

<div class="preview">
  <div>
    <div class="label">Liquid source</div>
    <pre>
    {%- raw -%}
{% let font: settings.font %}
  text: {{ text }},
  font: {{ font }}
{% endlet %}
    {%- endraw -%}
    </pre>
  </div>
  <div>
    <div class="label">HTML output</div>
    <pre>
{%- let font: settings.font %}
  text: {{ text }},
  font: {{ font }}
{% endlet -%}
    </pre>
  </div>
</div>

<div class="preview">
  <div>
    <div class="label">Liquid source</div>
    <pre>
    {%- raw -%}
Global is not impacted:
  - text: {{ text }},
  - font: {{ font }}
    {%- endraw -%}
    </pre>
  </div>
  <div>
    <div class="label">HTML output</div>
    <pre>
Global is not impacted:
  - text: {{ text }},
  - font: {{ font }}
    </pre>
  </div>
</div>