Home
Bruz
TASK FAILED SUCCESSFULLY

TASK FAILED SUCCESSFULLY

TradingGoose Ep2 MockUp

This tailwind example is contributed by Bruz, on 15-Sep-2025. Component is made with Tailwind CSS v3. It is responsive.

Author Bruz

245

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Terminal Mockup</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <style>
        @keyframes pulse {
            0%, 100% { opacity: 1; }
            50% { opacity: 0; }
        }
        .animate-pulse {
            animation: pulse 0.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
        }
        @keyframes blink {
            0%, 49% { opacity: 1; }
            50%, 100% { opacity: 0; }
        }
        .animate-blink {
            animation: blink 1s infinite;
        }
        @keyframes spin {
            0% { content: '|'; }
            25% { content: '/'; }
            50% { content: '-'; }
            75% { content: '\\'; }
            100% { content: '|'; }
        }
        .spinner::after {
            content: '|';
            animation: spin 0.5s linear infinite;
        }
        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }
        .fade-in {
            animation: fadeIn 0.3s forwards;
        }
    </style>
</head>
<body>
    <div class="flex flex-col h-screen bg-gray-900 text-gray-200 font-mono">
        
        <div class="flex items-center h-10 px-4 bg-gray-800 border-b border-gray-700">
            <div class="flex items-center space-x-2">
                <div class="h-3 w-3 rounded-full bg-red-500 hover:bg-red-600 transition-colors cursor-pointer"></div>
                <div class="h-3 w-3 rounded-full bg-yellow-500 hover:bg-yellow-600 transition-colors cursor-pointer"></div>
                <div class="h-3 w-3 rounded-full bg-green-500 hover:bg-green-600 transition-colors cursor-pointer"></div>
            </div>
            <div class="flex-1 text-center text-sm text-gray-400">
                Terminal - goose@computer
            </div>
        </div>
        
        
        <div class="flex-1 p-4 overflow-auto" id="terminal-body">
            
        </div>
        
        
        <div class="h-6 px-4 bg-gray-800 border-t border-gray-700 flex items-center justify-between text-xs text-gray-500">
            <span>bash 5.2.15</span>
            <span>UTF-8</span>
            <span id="status-info">80x24</span>
        </div>
    </div>

Related Examples

Basic Terms of Service Page
Basic Terms of Service Page setup for light and dark mode. Repeat the sections to add as many as you need.

Author:
Monica D.

1 year ago

3.3k
Privacy Policy
Privacy Policy

Author:
Tanvir Hasan Bappy (Tanvir)

1 year ago

1.2k
Soft Lights & Slow Beats
Sink into the tranquil rhythms of a Sunday afternoon. This playlist blends soft melodies and gentle beats to create a mysterious yet comforting atmosphere — perfect for relaxing, reflecting, or simply unwinding as the day fades away.

Author:
Bonimater

8 months ago

437
Google map iframe with tailwind

Author:
Kofi Osei

2 years ago

21.6k
blog component
good blog

Author:
Uwera Dorcas

7 months ago

732
Flex and Flex-Col
วิธีการใช้ Flex และ Flex-Col

Author:
rawitsara.tr

5 months ago

464
Rwanda-Canada Transport Services | Safe & Reliable Shipping
Attractive color scheme inspired by Rwanda's landscapes

Author:
Code Master(Mfuranziza Dusabe Hamza)

6 months ago

558
Login page

Author:
Reuben Enahoro

1 year ago

2.1k
Upvote downvote buttons [alpine]
upvote and downvote buttons made as working version in alpine.js

Author:
Anonymous

2 years ago

9k
profil_eleve.html

Author:
Anonymous

3 months ago

172
Resizable container
Resizable container

Author:
Ganesh Salunke

3 weeks ago

11
Footer
Elevate your website design with this sleek and minimalist light mode footer component by AB NAHID AGENCY. Crafted for clean UI experiences, it’s perfect for modern web apps, blogs, and business platforms. Easy to integrate, fully responsive, and built with scalability in mind—designed to blend seamlessly with any light-themed layout.

Author:
Abdul Jabbar Al Nahid

6 months ago

693

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components