Sizing
Set heights using classes like .form-control-lg and .form-control-sm.
<div class="block">
<input
class="mb-3 block w-full px-8 py-3 border dark:bg-dark-card dark:border-secondary-800 dark:focus:border-primary-400 placeholder-secondary-400 placeholder-text-xl rounded outline-none focus:border-primary-400 focus:shadow text-lg font-medium"
type="text" placeholder=".form-control-lg">
<div class="">
<select class="inline-block w-full py-3 px-8 mb-3 text-xl
text-secondary-500 bg-white border rounded outline-none dark:bg-dark-card dark:border-secondary-800 dark:focus:border-primary-500 focus:border-primary-400 focus:shadow ">
<option selected="">Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</div>
<input type="file" id="choose"
class="mb-3 block w-full text-xl border text-secondary-500 rounded outline-none dark:bg-dark-card dark:border-secondary-800 dark:focus:border-primary-500 focus:border-primary-400 focus:shadow ">
</div>
<div class="mt-4">
<input
class="mb-3 block w-full px-4 py-1 placeholder-secondary-500 border rounded outline-none dark:bg-dark-card dark:border-secondary-800 dark:focus:border-primary-500 focus:border-primary-400 focus:shadow "
type="text" placeholder=".form-control-sm">
<div class="mb-3">
<select
class="inline-block text-gray-600 w-full py-1 px-4 bg-white text-secondary-500 border rounded outline-none dark:bg-dark-card dark:border-secondary-800 dark:focus:border-primary-500 focus:border-primary-400 focus:shadow ">
<option selected="">Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</div>
<input type="file" id="choose1"
class="mb-3 block w-full px py text-sm border rounded outline-none dark:bg-dark-card dark:border-secondary-800 dark:focus:border-primary-500 focus:border-primary-400 focus:shadow ">
</div>
<div>