Adding flowbite and dasiy UI to windframe

Using flowbite and Dasiy UI in windframe to build TailwindCSS Components.


This guide will walk you through the process of using windframe's visual builder to integrate and customize flowbite and Daisy UI components to create stunning interface with ease.

Step-by-Step Guide

Step 1: Access the Windframe Visual Builder

  1. Begin by opening the Windframe Editor.
  2. Create a new project to start building your components.

create-project

Step 2: Install Flowbite and Daisy UI

  1. Within the Windframe interface, click on the Import button to view library options.

import-button.

  1. Choose either Install Flowbite or Install Daisy UI to add the desired component library to your project. The selected library will be automatically installed in the editor.

install-flowbite

Step 3: Import Flowbite and Daisy UI Components

  1. Once the libraries are installed, Copy the component code from Flowbite or Daisy UI.

  2. Click the Import button in Windframe and choose the HTML Import option.

html-import-options

  1. Paste the copied code into the provided modal.

  2. Click Import to add the component to your project.

import-components

Step 4: Customize Your Components

  1. Use Windframe's visual editor to adjust styles and properties.

  2. Customize the components to meet your design requirements. customize-component

  3. Save the changes after customizing the components.

Step 5: Export Your Project

  1. Once you've completed customizing your components, click on the Export button in the Windframe Export

  2. Choose the export format (e.g., HTML, CSS, or a code snippet).

choose-format

  1. Click download file to download the formated components.

download-file