Elicit UI components examples

Elicit

A loading state displaying a circular spinner, the word 'LOADING', and a helpful tip about downloading tables.

• Skeleton

Elicit

A numeric input field with minus and plus buttons to adjust the value, accompanied by a helper text showing the total cost.

• Input number

Elicit

A floating toast notification displaying an error message about insufficient credits to run a workflow.

• Notification Toast

Elicit

Two stacked toast notifications alerting the user about their credit balance. The top toast indicates zero credits, and the bottom indicates low credits. Both include an upgrade call to action.

• Notification Toast

Elicit

A toast notification warning the user that they are running low on credits, with a call to action to upgrade their account.

• Notification Toast

Elicit

• File upload input

Elicit

A pricing comparison card showing the user's current Basic plan and an option to upgrade to a Plus plan, with a toggle for yearly or monthly billing.

• Pricing section

Elicit

A list of documents with a toolbar above it containing search, sort, and upload actions. The list has a header row and one visible item with a checkbox, title, author, and an additional authors badge.

• Table

Elicit

A progress bar indicating the remaining credits for a user, with an icon and text label above it.

• Upgrade your plan

Elicit

A tabbed interface showing a file upload area for PDFs. The active tab is 'Extract data from PDFs'. The upload area features a drag-and-drop zone with a cloud icon and a button to browse files.

• File upload input

Elicit

A vertical sidebar navigation menu featuring a logo, primary links, an upgrade call-to-action, a history list, utility links, and user profile information with a credit balance.

• Vertical navigation

Elicit

A range slider used to select a publication year, with a single handle currently set to 2007 and a maximum value of 2024.

• Slider