---
updatedAt: 2025-08-06T07:31:02.000Z
agentTools:
  projectIndex: https://docs.frisbii-transform.com/llms.txt
---

# Appearance

# Styles

The style object provides you control over several elements in the iframe itself. It applies to each element following:

```Text JavaScript
var style = {
/* Some example values of available properties
{
    backgroundColor: '#ffffff',
    border: '1px solid #ccc',
    borderBottomColor: '#ccc',
    borderBottomWidth: '5px',
    borderColor: '#ccc',
    borderLeftColor: 'black',
    borderLeftWidth: '5px',
    borderRadius: '4px',
    borderRightColor: '#ccc',
    borderRightWidth: '5px',
    borderTopColor: '#ccc',
    borderTopWidth: '5px',
    borderWidth: '2px',
    boxShadow: 'inset 0 1px 1px rgba(0,0,0,.075)',
    color: '#444444',
    display: 'block'
    fontSize: '16px',
    fontFamily: '"Times New Roman", Times, serif',
    fontStyle: 'normal',
    fontWeight: '',
    height: '34px',
    lineHeight: 'normal',
    margin: '0',
    padding: '1px 2px'
}
*/
    body: {},
    container: {},
    input: {},
    inputInvalid: {},
    inputRequired: {},
    label: {},
    labelRequired: {},
    sectionContent: {},
    select: {},
    selectInvalid: {},
    selectRequired: {}
}
```

## Examples

A few simple examples of how to use the`paymentForm` can be found [here](https://github.com/billwerk/paymentForm-examples).

### Body

![](https://files.readme.io/13c4529-image.png)

### Label

![](https://files.readme.io/dc7b67e-image.png)

### Input

![](https://files.readme.io/a202405-image.png)

### Required Input & Invalid Input

![](https://files.readme.io/7893f78-image.png)