Skip to main content
Version: 7.0.0

User Properties

User Properties are used to customize your UI elements and page layouts.

  • Shortcut Ctrl+Shift+Q to open the User Properties.

"components": [
"className": ".sf-button",
"id": "a7c7-ad35-5715-3dbf",
"props": {
"children": [],
"name": "button1",
"parent": "57f4-201f-4bfc-5fc6",
"text": "User Properties"
"ref": null,
"source": {
"page": "__library__"
"type": "Button",
"userProps": {
"backgroundColor": "rgba( 25, 67, 238, 1 )",
"flexProps": {},
"left": 87,
"text": "User Properties",
"top": 344,
"width": 200

  • Using the user properties is a great way to customize your UI elements.
  • The properties are applied to the UI elements, that are created by the user.
  • The properties are going to be applied to the UI element's .cpx file, under the userProps.
  • The user properties are like a inline-style in web. So when you done with your UI elements and components design,we recommended to move your User Properties to the classes.
  • Using the classes, more easy to maintain your UI elements and components.
Using Style and Classes