BuouNext
  • Features
  • DocumentsNew
  • BrutalUINew
  • ShowcaseHot
  • Pricing
  • Blog

    Getting Started

    Introduction

    BuouNext Instruction

    InstallationRun BuouNextProject StructureComponentsAuthenticationEmailAPI CallsDatabasePaymentSEO OptimizationHeadless CMSContact

    AI Instruction

    AI ImageNewAI ChatbotNewAI SearchNewAI NotionNew

    Components

    Super ClockNewFloating DockNewAI Image CompareNewAvatar ListNewClockNewDarkModeNewStepperNewRotation AvatarNewButton with TrailNewDotNewGridNewCounter CardNewMarquee CardNewProfile CardNewBento gridNewBorder Trail CardNewBuouNext FeaturesNewColor CardNewMouse FollowingNewColor GridNewAnimotion In View CardNewLevitate CardNewReorder CardNewGenerate TextNewSmooth Fliping NumberNewSmooth Fliping TextNewSmooth Typing TextNewTyping TextNewWindow Typing TextNewFade In OutNewText DropNewScalingNew
    Docs
    Workflow Animation

    Workflow Animation

    You can see the workflow with scrolling

    Loading...

    Installation

    Copy and paste the cn util code into your project.

    import { ClassValue, clsx } from "clsx"
import { twMerge } from "tailwind-merge"
 
 
export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}

    Copy and paste the dot code into your project.

    API Reference

    Props

    PropTypeDescription
    titlestringWorkflow header.
    describtionstringWorkflow description.
    pathLengthsMotionValueframer-motion MotionValue

    Build with BuouUI

    Scroll this component and see the workflow!

    Logic
    Input

    logic was resolved to TRUE

    Input

    logic was resolved to FAIL

    Input

    2500

    Request

    https://api.example.com/v1/data

    Output

    2500

    Output