Web Application made easy

The open source PHP framework that works with Tailwind CSS. Build powerful web application and style it like a pro!

Learn More
app screenshot

Built-In Ui Views

Fohn-Ui comes with out-of-the-box, ready to use, views.

Some Views included with Fohn-Ui:

  1. Button
  2. Header
  3. List
  4. Message
  5. Tag
  6. and more...

Plus, it is easy to create your own.

Including them to the html page is as easy as:
Button::addTo(Ui::layout())->setLabel('Click Me')

Themable in PHP

Thanks to Tailwind Css utilities framework, theme can be built with only using PHP.

View are styled using a theme and theme can be extend, modified or created..

Ui::theme()::styleAs('Button', [$btn])

View as Component

Some views are defined as Vue.js renderless component, i.e. the template is provide by Fohn-Ui while the behavior is control by Vue.js

$form = Form::addTo($formContainer);
$form->getSubmitButton()->setLabel('Sign In');
$form->addHeader(View::factory()->setTextContent('Form component sample:'));
$form->addControl(Input::factory(['controlName' => 'email', 'inputType' => 'email', 'placeholder' => 'Email']));
$form->addControl(Password::factory(['controlName' => 'password', 'placeholder' => 'Password']));
$form->getControl('password')->onValidate(static function ($value) {
    $error = null;
    if (strlen($value) < 8) {
        $error = 'Password must be at least 8 characters.';
    }

    return $error;
});

$form->onSubmit(static function ($form) {
    return JsStatements::with([JsToast::success('Thanks you!')]);
});