Regione Toscana Design System

Spacing 

<div class="rtds-p-6">
    <div>
        <h2 class="rtds-text-2xl rtds-font-bold">Project spacing units.</h2>
        <p>Used for widths, margins and paddings, also in top, right, bottom, left and horizontal (x) and vertical (y) axis. Base 4px (1 unit). Rem unit is used</p>
        <p>Example of use: rtds-w-2, rtds-pt-2, rtds-mb-2, rtds-mx-2, rtds-py-2</p>
    </div>
    <div class="rtds-grid rtds-gap-6 rtds-p-4">

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 0</p>
            <div class="rtds-w-0 rtds-h-0 rtds-bg-primary-100 rtds-p-0"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 0.5</p>
            <div class="rtds-w-0.5 rtds-h-0 rtds-bg-primary-100 rtds-p-0.5"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 1</p>
            <div class="rtds-w-1 rtds-h-0 rtds-bg-primary-100 rtds-p-1"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 1.5</p>
            <div class="rtds-w-1.5 rtds-h-0 rtds-bg-primary-100 rtds-p-1.5"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 2</p>
            <div class="rtds-w-2 rtds-h-0 rtds-bg-primary-100 rtds-p-2"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 2.5</p>
            <div class="rtds-w-2.5 rtds-h-0 rtds-bg-primary-100 rtds-p-2.5"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 3</p>
            <div class="rtds-w-3 rtds-h-0 rtds-bg-primary-100 rtds-p-3"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 3.5</p>
            <div class="rtds-w-3.5 rtds-h-0 rtds-bg-primary-100 rtds-p-3.5"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 4</p>
            <div class="rtds-w-4 rtds-h-0 rtds-bg-primary-100 rtds-p-4"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 5</p>
            <div class="rtds-w-5 rtds-h-0 rtds-bg-primary-100 rtds-p-5"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 6</p>
            <div class="rtds-w-6 rtds-h-0 rtds-bg-primary-100 rtds-p-6"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 7</p>
            <div class="rtds-w-7 rtds-h-0 rtds-bg-primary-100 rtds-p-7"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 8</p>
            <div class="rtds-w-8 rtds-h-0 rtds-bg-primary-100 rtds-p-8"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 9</p>
            <div class="rtds-w-9 rtds-h-0 rtds-bg-primary-100 rtds-p-9"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 10</p>
            <div class="rtds-w-10 rtds-h-0 rtds-bg-primary-100 rtds-p-10"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 11</p>
            <div class="rtds-w-11 rtds-h-0 rtds-bg-primary-100 rtds-p-11"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 12</p>
            <div class="rtds-w-12 rtds-h-0 rtds-bg-primary-100 rtds-p-12"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 14</p>
            <div class="rtds-w-14 rtds-h-0 rtds-bg-primary-100 rtds-p-14"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 16</p>
            <div class="rtds-w-16 rtds-h-0 rtds-bg-primary-100 rtds-p-16"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 20</p>
            <div class="rtds-w-20 rtds-h-0 rtds-bg-primary-100 rtds-p-20"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 24</p>
            <div class="rtds-w-24 rtds-h-0 rtds-bg-primary-100 rtds-p-24"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 28</p>
            <div class="rtds-w-28 rtds-h-0 rtds-bg-primary-100 rtds-p-28"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 32</p>
            <div class="rtds-w-32 rtds-h-0 rtds-bg-primary-100 rtds-p-32"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 36</p>
            <div class="rtds-w-36 rtds-h-0 rtds-bg-primary-100 rtds-p-36"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 40</p>
            <div class="rtds-w-40 rtds-h-0 rtds-bg-primary-100 rtds-p-40"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 44</p>
            <div class="rtds-w-44 rtds-h-0 rtds-bg-primary-100 rtds-p-44"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 48</p>
            <div class="rtds-w-48 rtds-h-0 rtds-bg-primary-100 rtds-p-48"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 52</p>
            <div class="rtds-w-52 rtds-h-0 rtds-bg-primary-100 rtds-p-52"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 56</p>
            <div class="rtds-w-56 rtds-h-0 rtds-bg-primary-100 rtds-p-56"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 60</p>
            <div class="rtds-w-60 rtds-h-0 rtds-bg-primary-100 rtds-p-60"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 64</p>
            <div class="rtds-w-64 rtds-h-0 rtds-bg-primary-100 rtds-p-64"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 72</p>
            <div class="rtds-w-72 rtds-h-0 rtds-bg-primary-100 rtds-p-72"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 80</p>
            <div class="rtds-w-80 rtds-h-0 rtds-bg-primary-100 rtds-p-80"></div>
            <p></p>
        </div>

        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space 96</p>
            <div class="rtds-w-96 rtds-h-0 rtds-bg-primary-100 rtds-p-96"></div>
            <p></p>
        </div>

    </div>
</div>
 
<div class="rtds-p-6">
    <div>
    <h2 class="rtds-text-2xl rtds-font-bold">Project spacing units.</h2>
    <p>Used for widths, margins and paddings, also in top, right, bottom, left and horizontal (x) and vertical (y) axis. Base 4px (1 unit). Rem unit is used</p>
    <p>Example of use: rtds-w-2, rtds-pt-2, rtds-mb-2, rtds-mx-2, rtds-py-2</p>
    </div>
    <div class="rtds-grid rtds-gap-6 rtds-p-4">
    {% for space in spaces %}
        <div class="rtds-flex rtds-items-center rtds-gap-4">
            <p>space {{ space.unit }}</p> <div class="{{ space.classWidth }} rtds-h-0 rtds-bg-primary-100 {{ space.classPfull }}"></div> <p></p>
        </div>
    {% endfor %}
    </div>
</div>
 
{
  "spaces": [
    {
      "name": "rtds-space-0",
      "unit": 0,
      "classWidth": "rtds-w-0",
      "classMfull": "rtds-m-0",
      "classMx": "rtds-mx-0",
      "classMy": "rtds-my-0",
      "classMtop": "rtds-mt-0",
      "classMright": "rtds-mr-0",
      "classMbottom": "rtds-mb-0",
      "classMleft": "rtds-ml-0",
      "classPfull": "rtds-p-0",
      "classPx": "rtds-px-0",
      "classPy": "rtds-py-0",
      "classPtop": "rtds-pt-0",
      "classPright": "rtds-pr-0",
      "classPbottom": "rtds-pb-0",
      "classPleft": "rtds-pl-0"
    },
    {
      "name": "rtds-space-0.5",
      "unit": 0.5,
      "classWidth": "rtds-w-0.5",
      "classMfull": "rtds-m-0.5",
      "classMx": "rtds-mx-0.5",
      "classMy": "rtds-my-0.5",
      "classMtop": "rtds-mt-0.5",
      "classMright": "rtds-mr-0.5",
      "classMbottom": "rtds-mb-0.5",
      "classMleft": "rtds-ml-0.5",
      "classPfull": "rtds-p-0.5",
      "classPx": "rtds-px-0.5",
      "classPy": "rtds-py-0.5",
      "classPtop": "rtds-pt-0.5",
      "classPright": "rtds-pr-0.5",
      "classPbottom": "rtds-pb-0.5",
      "classPleft": "rtds-pl-0.5"
    },
    {
      "name": "rtds-space-1",
      "unit": 1,
      "classWidth": "rtds-w-1",
      "classMfull": "rtds-m-1",
      "classMx": "rtds-mx-1",
      "classMy": "rtds-my-1",
      "classMtop": "rtds-mt-1",
      "classMright": "rtds-mr-1",
      "classMbottom": "rtds-mb-1",
      "classMleft": "rtds-ml-1",
      "classPfull": "rtds-p-1",
      "classPx": "rtds-px-1",
      "classPy": "rtds-py-1",
      "classPtop": "rtds-pt-1",
      "classPright": "rtds-pr-1",
      "classPbottom": "rtds-pb-1",
      "classPleft": "rtds-pl-1"
    },
    {
      "name": "rtds-space-1.5",
      "unit": 1.5,
      "classWidth": "rtds-w-1.5",
      "classMfull": "rtds-m-1.5",
      "classMx": "rtds-mx-1.5",
      "classMy": "rtds-my-1.5",
      "classMtop": "rtds-mt-1.5",
      "classMright": "rtds-mr-1.5",
      "classMbottom": "rtds-mb-1.5",
      "classMleft": "rtds-ml-1.5",
      "classPfull": "rtds-p-1.5",
      "classPx": "rtds-px-1.5",
      "classPy": "rtds-py-1.5",
      "classPtop": "rtds-pt-1.5",
      "classPright": "rtds-pr-1.5",
      "classPbottom": "rtds-pb-1.5",
      "classPleft": "rtds-pl-1.5"
    },
    {
      "name": "rtds-space-2",
      "unit": 2,
      "classWidth": "rtds-w-2",
      "classMfull": "rtds-m-2",
      "classMx": "rtds-mx-2",
      "classMy": "rtds-my-2",
      "classMtop": "rtds-mt-2",
      "classMright": "rtds-mr-2",
      "classMbottom": "rtds-mb-2",
      "classMleft": "rtds-ml-2",
      "classPfull": "rtds-p-2",
      "classPx": "rtds-px-2",
      "classPy": "rtds-py-2",
      "classPtop": "rtds-pt-2",
      "classPright": "rtds-pr-2",
      "classPbottom": "rtds-pb-2",
      "classPleft": "rtds-pl-2"
    },
    {
      "name": "rtds-space-2.5",
      "unit": 2.5,
      "classWidth": "rtds-w-2.5",
      "classMfull": "rtds-m-2.5",
      "classMx": "rtds-mx-2.5",
      "classMy": "rtds-my-2.5",
      "classMtop": "rtds-mt-2.5",
      "classMright": "rtds-mr-2.5",
      "classMbottom": "rtds-mb-2.5",
      "classMleft": "rtds-ml-2.5",
      "classPfull": "rtds-p-2.5",
      "classPx": "rtds-px-2.5",
      "classPy": "rtds-py-2.5",
      "classPtop": "rtds-pt-2.5",
      "classPright": "rtds-pr-2.5",
      "classPbottom": "rtds-pb-2.5",
      "classPleft": "rtds-pl-2.5"
    },
    {
      "name": "rtds-space-3",
      "unit": 3,
      "classWidth": "rtds-w-3",
      "classMfull": "rtds-m-3",
      "classMx": "rtds-mx-3",
      "classMy": "rtds-my-3",
      "classMtop": "rtds-mt-3",
      "classMright": "rtds-mr-3",
      "classMbottom": "rtds-mb-3",
      "classMleft": "rtds-ml-3",
      "classPfull": "rtds-p-3",
      "classPx": "rtds-px-3",
      "classPy": "rtds-py-3",
      "classPtop": "rtds-pt-3",
      "classPright": "rtds-pr-3",
      "classPbottom": "rtds-pb-3",
      "classPleft": "rtds-pl-3"
    },
    {
      "name": "rtds-space-3.5",
      "unit": 3.5,
      "classWidth": "rtds-w-3.5",
      "classMfull": "rtds-m-3.5",
      "classMx": "rtds-mx-3.5",
      "classMy": "rtds-my-3.5",
      "classMtop": "rtds-mt-3.5",
      "classMright": "rtds-mr-3.5",
      "classMbottom": "rtds-mb-3.5",
      "classMleft": "rtds-ml-3.5",
      "classPfull": "rtds-p-3.5",
      "classPx": "rtds-px-3.5",
      "classPy": "rtds-py-3.5",
      "classPtop": "rtds-pt-3.5",
      "classPright": "rtds-pr-3.5",
      "classPbottom": "rtds-pb-3.5",
      "classPleft": "rtds-pl-3.5"
    },
    {
      "name": "rtds-space-4",
      "unit": 4,
      "classWidth": "rtds-w-4",
      "classMfull": "rtds-m-4",
      "classMx": "rtds-mx-4",
      "classMy": "rtds-my-4",
      "classMtop": "rtds-mt-4",
      "classMright": "rtds-mr-4",
      "classMbottom": "rtds-mb-4",
      "classMleft": "rtds-ml-4",
      "classPfull": "rtds-p-4",
      "classPx": "rtds-px-4",
      "classPy": "rtds-py-4",
      "classPtop": "rtds-pt-4",
      "classPright": "rtds-pr-4",
      "classPbottom": "rtds-pb-4",
      "classPleft": "rtds-pl-4"
    },
    {
      "name": "rtds-space-5",
      "unit": 5,
      "classWidth": "rtds-w-5",
      "classMfull": "rtds-m-5",
      "classMx": "rtds-mx-5",
      "classMy": "rtds-my-5",
      "classMtop": "rtds-mt-5",
      "classMright": "rtds-mr-5",
      "classMbottom": "rtds-mb-5",
      "classMleft": "rtds-ml-5",
      "classPfull": "rtds-p-5",
      "classPx": "rtds-px-5",
      "classPy": "rtds-py-5",
      "classPtop": "rtds-pt-5",
      "classPright": "rtds-pr-5",
      "classPbottom": "rtds-pb-5",
      "classPleft": "rtds-pl-5"
    },
    {
      "name": "rtds-space-6",
      "unit": 6,
      "classWidth": "rtds-w-6",
      "classMfull": "rtds-m-6",
      "classMx": "rtds-mx-6",
      "classMy": "rtds-my-6",
      "classMtop": "rtds-mt-6",
      "classMright": "rtds-mr-6",
      "classMbottom": "rtds-mb-6",
      "classMleft": "rtds-ml-6",
      "classPfull": "rtds-p-6",
      "classPx": "rtds-px-6",
      "classPy": "rtds-py-6",
      "classPtop": "rtds-pt-6",
      "classPright": "rtds-pr-6",
      "classPbottom": "rtds-pb-6",
      "classPleft": "rtds-pl-6"
    },
    {
      "name": "rtds-space-7",
      "unit": 7,
      "classWidth": "rtds-w-7",
      "classMfull": "rtds-m-7",
      "classMx": "rtds-mx-7",
      "classMy": "rtds-my-7",
      "classMtop": "rtds-mt-7",
      "classMright": "rtds-mr-7",
      "classMbottom": "rtds-mb-7",
      "classMleft": "rtds-ml-7",
      "classPfull": "rtds-p-7",
      "classPx": "rtds-px-7",
      "classPy": "rtds-py-7",
      "classPtop": "rtds-pt-7",
      "classPright": "rtds-pr-7",
      "classPbottom": "rtds-pb-7",
      "classPleft": "rtds-pl-7"
    },
    {
      "name": "rtds-space-8",
      "unit": 8,
      "classWidth": "rtds-w-8",
      "classMfull": "rtds-m-8",
      "classMx": "rtds-mx-8",
      "classMy": "rtds-my-8",
      "classMtop": "rtds-mt-8",
      "classMright": "rtds-mr-8",
      "classMbottom": "rtds-mb-8",
      "classMleft": "rtds-ml-8",
      "classPfull": "rtds-p-8",
      "classPx": "rtds-px-8",
      "classPy": "rtds-py-8",
      "classPtop": "rtds-pt-8",
      "classPright": "rtds-pr-8",
      "classPbottom": "rtds-pb-8",
      "classPleft": "rtds-pl-8"
    },
    {
      "name": "rtds-space-9",
      "unit": 9,
      "classWidth": "rtds-w-9",
      "classMfull": "rtds-m-9",
      "classMx": "rtds-mx-9",
      "classMy": "rtds-my-9",
      "classMtop": "rtds-mt-9",
      "classMright": "rtds-mr-9",
      "classMbottom": "rtds-mb-9",
      "classMleft": "rtds-ml-9",
      "classPfull": "rtds-p-9",
      "classPx": "rtds-px-9",
      "classPy": "rtds-py-9",
      "classPtop": "rtds-pt-9",
      "classPright": "rtds-pr-9",
      "classPbottom": "rtds-pb-9",
      "classPleft": "rtds-pl-9"
    },
    {
      "name": "rtds-space-10",
      "unit": 10,
      "classWidth": "rtds-w-10",
      "classMfull": "rtds-m-10",
      "classMx": "rtds-mx-10",
      "classMy": "rtds-my-10",
      "classMtop": "rtds-mt-10",
      "classMright": "rtds-mr-10",
      "classMbottom": "rtds-mb-10",
      "classMleft": "rtds-ml-10",
      "classPfull": "rtds-p-10",
      "classPx": "rtds-px-10",
      "classPy": "rtds-py-10",
      "classPtop": "rtds-pt-10",
      "classPright": "rtds-pr-10",
      "classPbottom": "rtds-pb-10",
      "classPleft": "rtds-pl-10"
    },
    {
      "name": "rtds-space-11",
      "unit": 11,
      "classWidth": "rtds-w-11",
      "classMfull": "rtds-m-11",
      "classMx": "rtds-mx-11",
      "classMy": "rtds-my-11",
      "classMtop": "rtds-mt-11",
      "classMright": "rtds-mr-11",
      "classMbottom": "rtds-mb-11",
      "classMleft": "rtds-ml-11",
      "classPfull": "rtds-p-11",
      "classPx": "rtds-px-11",
      "classPy": "rtds-py-11",
      "classPtop": "rtds-pt-11",
      "classPright": "rtds-pr-11",
      "classPbottom": "rtds-pb-11",
      "classPleft": "rtds-pl-11"
    },
    {
      "name": "rtds-space-12",
      "unit": 12,
      "classWidth": "rtds-w-12",
      "classMfull": "rtds-m-12",
      "classMx": "rtds-mx-12",
      "classMy": "rtds-my-12",
      "classMtop": "rtds-mt-12",
      "classMright": "rtds-mr-12",
      "classMbottom": "rtds-mb-12",
      "classMleft": "rtds-ml-12",
      "classPfull": "rtds-p-12",
      "classPx": "rtds-px-12",
      "classPy": "rtds-py-12",
      "classPtop": "rtds-pt-12",
      "classPright": "rtds-pr-12",
      "classPbottom": "rtds-pb-12",
      "classPleft": "rtds-pl-12"
    },
    {
      "name": "rtds-space-14",
      "unit": 14,
      "classWidth": "rtds-w-14",
      "classMfull": "rtds-m-14",
      "classMx": "rtds-mx-14",
      "classMy": "rtds-my-14",
      "classMtop": "rtds-mt-14",
      "classMright": "rtds-mr-14",
      "classMbottom": "rtds-mb-14",
      "classMleft": "rtds-ml-14",
      "classPfull": "rtds-p-14",
      "classPx": "rtds-px-14",
      "classPy": "rtds-py-14",
      "classPtop": "rtds-pt-14",
      "classPright": "rtds-pr-14",
      "classPbottom": "rtds-pb-14",
      "classPleft": "rtds-pl-14"
    },
    {
      "name": "rtds-space-16",
      "unit": 16,
      "classWidth": "rtds-w-16",
      "classMfull": "rtds-m-16",
      "classMx": "rtds-mx-16",
      "classMy": "rtds-my-16",
      "classMtop": "rtds-mt-16",
      "classMright": "rtds-mr-16",
      "classMbottom": "rtds-mb-16",
      "classMleft": "rtds-ml-16",
      "classPfull": "rtds-p-16",
      "classPx": "rtds-px-16",
      "classPy": "rtds-py-16",
      "classPtop": "rtds-pt-16",
      "classPright": "rtds-pr-16",
      "classPbottom": "rtds-pb-16",
      "classPleft": "rtds-pl-16"
    },
    {
      "name": "rtds-space-20",
      "unit": 20,
      "classWidth": "rtds-w-20",
      "classMfull": "rtds-m-20",
      "classMx": "rtds-mx-20",
      "classMy": "rtds-my-20",
      "classMtop": "rtds-mt-20",
      "classMright": "rtds-mr-20",
      "classMbottom": "rtds-mb-20",
      "classMleft": "rtds-ml-20",
      "classPfull": "rtds-p-20",
      "classPx": "rtds-px-20",
      "classPy": "rtds-py-20",
      "classPtop": "rtds-pt-20",
      "classPright": "rtds-pr-20",
      "classPbottom": "rtds-pb-20",
      "classPleft": "rtds-pl-20"
    },
    {
      "name": "rtds-space-24",
      "unit": 24,
      "classWidth": "rtds-w-24",
      "classMfull": "rtds-m-24",
      "classMx": "rtds-mx-24",
      "classMy": "rtds-my-24",
      "classMtop": "rtds-mt-24",
      "classMright": "rtds-mr-24",
      "classMbottom": "rtds-mb-24",
      "classMleft": "rtds-ml-24",
      "classPfull": "rtds-p-24",
      "classPx": "rtds-px-24",
      "classPy": "rtds-py-24",
      "classPtop": "rtds-pt-24",
      "classPright": "rtds-pr-24",
      "classPbottom": "rtds-pb-24",
      "classPleft": "rtds-pl-24"
    },
    {
      "name": "rtds-space-28",
      "unit": 28,
      "classWidth": "rtds-w-28",
      "classMfull": "rtds-m-28",
      "classMx": "rtds-mx-28",
      "classMy": "rtds-my-28",
      "classMtop": "rtds-mt-28",
      "classMright": "rtds-mr-28",
      "classMbottom": "rtds-mb-28",
      "classMleft": "rtds-ml-28",
      "classPfull": "rtds-p-28",
      "classPx": "rtds-px-28",
      "classPy": "rtds-py-28",
      "classPtop": "rtds-pt-28",
      "classPright": "rtds-pr-28",
      "classPbottom": "rtds-pb-28",
      "classPleft": "rtds-pl-28"
    },
    {
      "name": "rtds-space-32",
      "unit": 32,
      "classWidth": "rtds-w-32",
      "classMfull": "rtds-m-32",
      "classMx": "rtds-mx-32",
      "classMy": "rtds-my-32",
      "classMtop": "rtds-mt-32",
      "classMright": "rtds-mr-32",
      "classMbottom": "rtds-mb-32",
      "classMleft": "rtds-ml-32",
      "classPfull": "rtds-p-32",
      "classPx": "rtds-px-32",
      "classPy": "rtds-py-32",
      "classPtop": "rtds-pt-32",
      "classPright": "rtds-pr-32",
      "classPbottom": "rtds-pb-32",
      "classPleft": "rtds-pl-32"
    },
    {
      "name": "rtds-space-36",
      "unit": 36,
      "classWidth": "rtds-w-36",
      "classMfull": "rtds-m-36",
      "classMx": "rtds-mx-36",
      "classMy": "rtds-my-36",
      "classMtop": "rtds-mt-36",
      "classMright": "rtds-mr-36",
      "classMbottom": "rtds-mb-36",
      "classMleft": "rtds-ml-36",
      "classPfull": "rtds-p-36",
      "classPx": "rtds-px-36",
      "classPy": "rtds-py-36",
      "classPtop": "rtds-pt-36",
      "classPright": "rtds-pr-36",
      "classPbottom": "rtds-pb-36",
      "classPleft": "rtds-pl-36"
    },
    {
      "name": "rtds-space-40",
      "unit": 40,
      "classWidth": "rtds-w-40",
      "classMfull": "rtds-m-40",
      "classMx": "rtds-mx-40",
      "classMy": "rtds-my-40",
      "classMtop": "rtds-mt-40",
      "classMright": "rtds-mr-40",
      "classMbottom": "rtds-mb-40",
      "classMleft": "rtds-ml-40",
      "classPfull": "rtds-p-40",
      "classPx": "rtds-px-40",
      "classPy": "rtds-py-40",
      "classPtop": "rtds-pt-40",
      "classPright": "rtds-pr-40",
      "classPbottom": "rtds-pb-40",
      "classPleft": "rtds-pl-40"
    },
    {
      "name": "rtds-space-44",
      "unit": 44,
      "classWidth": "rtds-w-44",
      "classMfull": "rtds-m-44",
      "classMx": "rtds-mx-44",
      "classMy": "rtds-my-44",
      "classMtop": "rtds-mt-44",
      "classMright": "rtds-mr-44",
      "classMbottom": "rtds-mb-44",
      "classMleft": "rtds-ml-44",
      "classPfull": "rtds-p-44",
      "classPx": "rtds-px-44",
      "classPy": "rtds-py-44",
      "classPtop": "rtds-pt-44",
      "classPright": "rtds-pr-44",
      "classPbottom": "rtds-pb-44",
      "classPleft": "rtds-pl-44"
    },
    {
      "name": "rtds-space-48",
      "unit": 48,
      "classWidth": "rtds-w-48",
      "classMfull": "rtds-m-48",
      "classMx": "rtds-mx-48",
      "classMy": "rtds-my-48",
      "classMtop": "rtds-mt-48",
      "classMright": "rtds-mr-48",
      "classMbottom": "rtds-mb-48",
      "classMleft": "rtds-ml-48",
      "classPfull": "rtds-p-48",
      "classPx": "rtds-px-48",
      "classPy": "rtds-py-48",
      "classPtop": "rtds-pt-48",
      "classPright": "rtds-pr-48",
      "classPbottom": "rtds-pb-48",
      "classPleft": "rtds-pl-48"
    },
    {
      "name": "rtds-space-52",
      "unit": 52,
      "classWidth": "rtds-w-52",
      "classMfull": "rtds-m-52",
      "classMx": "rtds-mx-52",
      "classMy": "rtds-my-52",
      "classMtop": "rtds-mt-52",
      "classMright": "rtds-mr-52",
      "classMbottom": "rtds-mb-52",
      "classMleft": "rtds-ml-52",
      "classPfull": "rtds-p-52",
      "classPx": "rtds-px-52",
      "classPy": "rtds-py-52",
      "classPtop": "rtds-pt-52",
      "classPright": "rtds-pr-52",
      "classPbottom": "rtds-pb-52",
      "classPleft": "rtds-pl-52"
    },
    {
      "name": "rtds-space-56",
      "unit": 56,
      "classWidth": "rtds-w-56",
      "classMfull": "rtds-m-56",
      "classMx": "rtds-mx-56",
      "classMy": "rtds-my-56",
      "classMtop": "rtds-mt-56",
      "classMright": "rtds-mr-56",
      "classMbottom": "rtds-mb-56",
      "classMleft": "rtds-ml-56",
      "classPfull": "rtds-p-56",
      "classPx": "rtds-px-56",
      "classPy": "rtds-py-56",
      "classPtop": "rtds-pt-56",
      "classPright": "rtds-pr-56",
      "classPbottom": "rtds-pb-56",
      "classPleft": "rtds-pl-56"
    },
    {
      "name": "rtds-space-60",
      "unit": 60,
      "classWidth": "rtds-w-60",
      "classMfull": "rtds-m-60",
      "classMx": "rtds-mx-60",
      "classMy": "rtds-my-60",
      "classMtop": "rtds-mt-60",
      "classMright": "rtds-mr-60",
      "classMbottom": "rtds-mb-60",
      "classMleft": "rtds-ml-60",
      "classPfull": "rtds-p-60",
      "classPx": "rtds-px-60",
      "classPy": "rtds-py-60",
      "classPtop": "rtds-pt-60",
      "classPright": "rtds-pr-60",
      "classPbottom": "rtds-pb-60",
      "classPleft": "rtds-pl-60"
    },
    {
      "name": "rtds-space-64",
      "unit": 64,
      "classWidth": "rtds-w-64",
      "classMfull": "rtds-m-64",
      "classMx": "rtds-mx-64",
      "classMy": "rtds-my-64",
      "classMtop": "rtds-mt-64",
      "classMright": "rtds-mr-64",
      "classMbottom": "rtds-mb-64",
      "classMleft": "rtds-ml-64",
      "classPfull": "rtds-p-64",
      "classPx": "rtds-px-64",
      "classPy": "rtds-py-64",
      "classPtop": "rtds-pt-64",
      "classPright": "rtds-pr-64",
      "classPbottom": "rtds-pb-64",
      "classPleft": "rtds-pl-64"
    },
    {
      "name": "rtds-space-72",
      "unit": 72,
      "classWidth": "rtds-w-72",
      "classMfull": "rtds-m-72",
      "classMx": "rtds-mx-72",
      "classMy": "rtds-my-72",
      "classMtop": "rtds-mt-72",
      "classMright": "rtds-mr-72",
      "classMbottom": "rtds-mb-72",
      "classMleft": "rtds-ml-72",
      "classPfull": "rtds-p-72",
      "classPx": "rtds-px-72",
      "classPy": "rtds-py-72",
      "classPtop": "rtds-pt-72",
      "classPright": "rtds-pr-72",
      "classPbottom": "rtds-pb-72",
      "classPleft": "rtds-pl-72"
    },
    {
      "name": "rtds-space-80",
      "unit": 80,
      "classWidth": "rtds-w-80",
      "classMfull": "rtds-m-80",
      "classMx": "rtds-mx-80",
      "classMy": "rtds-my-80",
      "classMtop": "rtds-mt-80",
      "classMright": "rtds-mr-80",
      "classMbottom": "rtds-mb-80",
      "classMleft": "rtds-ml-80",
      "classPfull": "rtds-p-80",
      "classPx": "rtds-px-80",
      "classPy": "rtds-py-80",
      "classPtop": "rtds-pt-80",
      "classPright": "rtds-pr-80",
      "classPbottom": "rtds-pb-80",
      "classPleft": "rtds-pl-80"
    },
    {
      "name": "rtds-space-96",
      "unit": 96,
      "classWidth": "rtds-w-96",
      "classMfull": "rtds-m-96",
      "classMx": "rtds-mx-96",
      "classMy": "rtds-my-96",
      "classMtop": "rtds-mt-96",
      "classMright": "rtds-mr-96",
      "classMbottom": "rtds-mb-96",
      "classMleft": "rtds-ml-96",
      "classPfull": "rtds-p-96",
      "classPx": "rtds-px-96",
      "classPy": "rtds-py-96",
      "classPtop": "rtds-pt-96",
      "classPright": "rtds-pr-96",
      "classPbottom": "rtds-pb-96",
      "classPleft": "rtds-pl-96"
    }
  ]
}

Spacing scale used for margins, padding, fixed element height etc… Base 4px (0.24rem) as Tailwind default. The values are proportional, so 16 is twice as much spacing as 8 for example. One spacing unit is equal to 0.25rem, which translates to 4px by default in common browsers.

Tailwind margin documentation

Tailwind padding documentation

Customizing spacing - example