Paper UI components examples

Paper

A user profile dropdown menu displaying the signed-in user's name, email, and a log out option.

• Dropdown menu

Paper

A modal presenting a "Paper Pro" subscription plan, detailing its monthly price, a yearly billing option with a discount, and a comprehensive list of included features, culminating in a call-to-action button.

• Modal

Paper

A card displaying a video thumbnail and description about syncing designs with code.

• Card

Paper

A file card with a contextual menu displaying actions like open, rename, and archive.

• Dropdown menu

Paper

A modal dialog box for adjusting 'nudge amount' with two input fields, one of which is focused.

• Modal

Paper

A context menu displaying various actions related to element manipulation, styling, and layout, with associated keyboard shortcuts.

• Dropdown menu

Paper

A context menu displaying options for image manipulation and UI visibility control.

• Dropdown menu

Paper

A user interface for text-to-image generation featuring a text input field, a style selection dropdown, and a button to create an image.

• Artificial intelligence

Paper

A segmented control with two options, 'Contain' and 'Cover', under a 'Fit' label.

• Segmented control

Paper

A modal window presenting various visual shaders, including image filters, logo animations, and effects, organized into distinct categories with visual previews.

• Modal

Paper

A color picker modal displaying a color spectrum, hue and opacity sliders, numerical input fields for various color models, and a dropdown for selecting color format.

• Color picker

Paper

A user interface component for adjusting a radius value using a slider and a numerical input field.

• Slider