# Appearance

> Appearance

Source: https://docs.tryyoursize.com/reference/react-native/appearance/

*Type* · `@tryyoursize/react-native`

```ts
interface Appearance
```

## Properties

- **`theme`** (`"inherit" | "tryyoursize"`, optional): "inherit" (default): your app's own colours and font. "tryyoursize": the light beige brand.
- **`variables`** (`{ /** Hex: "#rrggbb" or "#rrggbbaa". */ colorPrimary?: string; colorBackground?: string; colorText?: string; /** A CSS font-family for the window. */ fontFamily?: string; /** Corner radius, 0–32. */ borderRadius?: number; }`, optional)
- **`fonts`** (`{ cssSrc: string }[]`, optional): Google Fonts stylesheets for the window.

## Example

**React Native**

```tsx
await configure("pk_test_…", { appearance: { variables: { borderRadius: 10 } }, locale: "es" });
```

**Swift**

```swift
let tys = try TryYourSize(publishableKey: "pk_test_…", configuration: .init(
    appearance: Appearance(borderRadius: 10),
    locale: "es"))
```

**Kotlin**

```kotlin
val tys = TryYourSize(context, "pk_test_…", TryYourSize.Configuration(
    appearance = Appearance(borderRadius = 10f),
    locale = "es",
))
```

**Flutter**

```dart
final tys = await TryYourSize.create('pk_test_…', appearance: const Appearance(borderRadius: 10), locale: 'es');
```