UI Library

Overview of UI Library

Visily’s Library contains thousands of UI elements and templates, plus over 55,000 icons that can be easily added to your designs.

All elements and templates use the color palette and fonts specified in your Project Theme, making them a seamless part of your design system. This helps you achieve beautiful and consistent designs with minimal effort.

Access the Library

To enter the Library, simply click on the Library icon in the left sidebar menu. Once you’re inside, you can easily switch between the Elements, Templates, or Icons tabs to quickly find the perfect items for your designs.

Library update
The search bar is global, you can input a single keyword and easily switch between tabs to see relevant results. This makes it easy to find things across all Library categories.

The Elements Tab

The “Elements” tab in Visily’s Library contains both basic elements and smart components, which are essential building blocks for any design or template.

  • Basic elements: These are primitive elements like texts, shapes and images.
  • Smart components: These components come with many presets, styles and behaviors specific for their use case. In addition, their layout automatically adjust as you edit or resize their contents. Examples of smart components:
    • Button, Textbox, Textarea, Dropdown
    • Checkbox, Radio, Switch, Rating, Avatar, Tag
    • Various Chart and Menu components
Library update - Element
Don’t miss out on Container, a special rectangle that automatically attaches child elements when you drop them into it. It’s perfect for creating backgrounds for cards, forms, dialogs, and more. Learn more about the container here.
Library update - Container

The Templates Tab

Explore hundreds of beautiful component templates across various categories, such as Forms, Cards, Navigation, Alerts & Messages, Tables & Listings, and more.

If you’re only interested in web or mobile templates, use the filter “Best for web” or “Best for mobile”.

To access full-screen templates, click the “View full-screen templates” button near the top of the Templates tab (under the filter section).

Can’t find the template you need? Send us your request here and we’ll add it to our pipeline for the template library.
Suggest new

The Icons Tab

Visily makes finding the perfect icon a breeze! With over 55,000 icons to choose from and powerful search capabilities, you’ll find what you need in no time. Access these icons through the Library (Icons Tab) or the toolbar of smart components such as buttons and menus.

Icon Library

The Icon Library includes tools to help you quickly browse and find icons. You can filter by categories, styles, or search icons by keyword.

Library update - Icon

Icon’s or smart component’s toolbar

Once you add an icon to the canvas, you can replace/edit it at any time through its toolbar.

Some smart components, such as Button, Textbox, Dropdown, Tag, and Menu have built-in icon support. Click the “Icon” menu item in the smart component’s toolbar to access the icon popup.

Related Articles

Subscribe to
Visily now

Don’t miss out on the latest articles to stay a top of UX design and Product management

© 2024 Visily. All rights reserved.

© 2024 Visily, Inc. All rights reserved.