how to give space between checkbox and choice value

No it is not possible, if you try to add spaces they will be trimmed automatically. I would suggest giving a try to "CARDS" choiceStyle.

Sure. Use char(160) to add some non-breaking spaces.

a!checkboxField(
label :"Hello",
choiceLabels: {char(160)&char(160)&"abc",char(160)&char(160)&"def",char(160)&char(160)&"pqr"},
choiceValues: {1,2,3}
)

Try with check box choice label as empty and add your labels in the Separate Rich text display field from that you can achieve space between check box and labels .

{
  a!sideBySideLayout(
    items: {
      a!sideBySideItem(
        item: a!checkboxField(
          label: "Checkboxes",
          labelPosition: "COLLAPSED",
          choiceLabels: {
            ""
          },
          choiceValues: {
           1
          },
          saveInto: {},
          validations: {},
          align:"RIGHT"
        ),
        width:"1X"
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {
            
            a!richTextItem(
              text:"ABC"
            )
          }
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      a!sideBySideItem(
        item: a!richTextDisplayField(
          labelPosition: "COLLAPSED",
          value: {}
        )
      ),
      
    }
  ),
  
}

Thanks Stefen.That works

This always works like a charm but be aware that it is not like padding. This is actually adding characters in your choiceLabels making the length of each of them change.

How can I forget about adding hard spaces to the string even after reading your recent blog on Formatting Labels in Appian few days back which btw is really cool and is all about "magic of unicode character".

Thanks a lot :-) Yeah, Unicode is a real treasure chest ⅏