Cohere UI components examples

Cohere

A radio button group asking the user to confirm safety mechanisms, with Yes and No options.

• Checkbox & radio

Cohere

A form section asking the user to confirm safety mechanisms using Yes/No radio buttons.

• Checkbox & radio

Cohere

• Progress indicator

Cohere

Displays an input text string alongside a panel showing AI classification results with confidence percentages and visual bar indicators for different categories.

• Progress indicator

Cohere

A horizontal bar displaying a classification result with a label and a percentage score.

• Progress indicator

Cohere

A horizontal bar displaying a classification result with a confidence percentage. The bar is partially filled with a coral color, indicating the score level.

• Progress indicator

Cohere

• Code block

Cohere

A dark tooltip displaying descriptive text, positioned above a row of light gray tags or buttons.

• Tooltip

Cohere

An open dropdown menu for selecting an AI model. It shows the currently selected model at the top, followed by a list of available baseline models with the active one highlighted.

• Input select

Cohere

A dropdown select input for choosing an AI model, featuring a label with an info icon.

• Input select

Cohere

A slider control used to set the approximate number of words for text generation. It features a label, an info icon, a numeric value display, and a thick purple slider track with a white handle.

• Slider

Cohere

A vertical sidebar navigation menu with grouped links for Explore and Settings.

• Vertical navigation