Yani bu çok genel bir soru, tasarımın nasılsa ona göre yaparsın. En basit haliyle istersen;

<form action="" method="get" class="search">
    <input type="text" placeholder="Arama yap">
    <button type="submit">Ara</button>
</form>

<style>
    form.search {
        display: flex;
    }
    form.search input {
        height: 40px;
        border: 1px solid #ddd;
        border-radius: 4px 0 0 4px;
        font-size: 16px;
        font-weight: 500;
        box-sizing: border-box;
		padding: 0 15px;
		flex: 1;
		outline: 0;
    }
    form.search button {
        height: 40px;
        padding: 0 30px;
        background: #393a3b;
        color: #fff;
        border-radius: 0 4px 4px 0;
        cursor: pointer;
        color: #fff;
        font-size: 16px;
        font-weight: 500;
        border: none;
    }
</style>

tabi html/css ile sadece görüntüsünü yaparsın, işlevsellik için bir yazılım dili şart.