# Custom Label

Showing participant info is an important part of the calling experience, and can have different design variations. By default, the SDK shows the name of the participant with white color, in a black container with opacity. Additionally, it shows the connection info, as well as whether the user is pinned.

You can change this default UI by implementing the `makeVideoCallParticipantModifier` in your custom `ViewFactory`. For example, let's simplify this view and just display a bold white name of the participant.

![Screenshot shows the custom video label](https://getstream.io/docs-assets/images/f788a93ae680.png)

```swift
func makeVideoCallParticipantModifier(
    participant: CallParticipant,
    call: Call?,
    availableFrame: CGRect,
    ratio: CGFloat,
    showAllInfo: Bool
) -> some ViewModifier {
    CustomParticipantModifier(
        participant: participant,
        call: call,
        availableFrame: availableFrame,
        ratio: ratio,
        showAllInfo: showAllInfo
    )
}
```

The implementation of the `CustomParticipantModifier` looks like this:

```swift
struct CustomParticipantModifier: ViewModifier {

    var participant: CallParticipant
    var call: Call?
    var availableFrame: CGRect
    var ratio: CGFloat
    var showAllInfo: Bool

    public init(
        participant: CallParticipant,
        call: Call?,
        availableFrame: CGRect,
        ratio: CGFloat,
        showAllInfo: Bool
    ) {
        self.participant = participant
        self.call = call
        self.availableFrame = availableFrame
        self.ratio = ratio
        self.showAllInfo = showAllInfo
    }

    public func body(content: Content) -> some View {
        content
            .adjustVideoFrame(to: availableFrame.size.width, ratio: ratio)
            .overlay(
                ZStack {
                    VStack {
                        Spacer()
                        HStack {
                            Text(participant.name)
                                .foregroundColor(.white)
                                .bold()
                            Spacer()
                            ConnectionQualityIndicator(
                                connectionQuality: participant.connectionQuality
                            )
                        }
                        .padding(.bottom, 2)
                    }
                    .padding()
                }
                .modifier(VideoCallParticipantSpeakingModifier(participant: participant, participantCount: 1))
            )
    }
}
```

The important part here is the overlay applied to the view. Here, we are using a `ZStack` as a container, while putting the name and the connection quality indicator at the bottom of a `VStack`.


---

This page was last updated at 2026-08-10T16:01:03.087Z.

For the most recent version of this documentation, visit [https://getstream.io/video/docs/ios/ui-cookbook/participant-label/](https://getstream.io/video/docs/ios/ui-cookbook/participant-label/).