Published Apr 20, 2024 in PHP

Style your CLI applications with Termwind

Termwind is like Tailwind CSS, it is for styling your PHP CLI applications.

Getting started with Termwind

Termwind enables developers to seamlessly integrate Tailwind-like CSS classes directly into their PHP code, facilitating stylish CLI outputs.

To get started with using Termwind run the following command;

composer require nunomaduro/termwind

After that create a cli.php file

<?php

require 'vendor/autoload.php';

use function Termwind\{render};

render(<<<'HTML'
    <div>
        <div class="px-4 text-red-800 bg-white uppercase">Termwind</div>
        <em class="ml-2">
          Give your CLI apps a unique look
        </em>
    </div>
HTML);

This will give us an output like this;

ask() Method Usage

You can utilize the ask() function to present a question to the user. The return provided by this method will be the answer.

<?php

require 'vendor/autoload.php';

use function Termwind\{render};
use function Termwind\{ask};

$answer = ask(<<<HTML
    <span class="mt-1 ml-2 mr-1 bg-green px-1 text-black">
        What is your name?
    </span>
HTML);

render(<<<HTML
    <span class="mt-1 ml-2 mr-1 bg-green px-1 text-black">
        Hello, $answer!
    </span>
HTML);

The output will be like this;

Style your CLI applications with Termwind image 3

Add Custom Style With style() Method

The style() function allows users to incorporate custom styles and modify colors as needed.

In this example, we are creating a custom my-btn class.

<?php

require 'vendor/autoload.php';

use function Termwind\{render};
use function Termwind\{style};

style('my-btn')->apply('bg-blue', 'text-black');

render(<<<HTML
    <button class="my-btn p-8">
        Click me
    </button>
HTML);