diff --git a/src/app/sites/generator/qrcode/generator-qrcode.html b/src/app/sites/generator/qrcode/generator-qrcode.html
index d6a59a1..4dd74b1 100644
--- a/src/app/sites/generator/qrcode/generator-qrcode.html
+++ b/src/app/sites/generator/qrcode/generator-qrcode.html
@@ -18,9 +18,9 @@
 
             <div [formGroup]="qrCodeDetailsForm" class="space-y-6">
                 <div>
-                    <label class="block text-sm font-medium text-gray-300 mb-2">Text or URL</label>
+                    <label class="block text-sm font-medium text-gray-300 mb-2">Text or URL*</label>
                     <input type="text" placeholder="Enter text or URL" formControlName="text"
-                        class="w-full bg-zinc-700 text-white rounded-md border border-gray-600 p-2" />
+                        class="w-full bg-zinc-700 text-white rounded-md border border-gray-600 p-2 focus:outline-none" [ngClass]="{'border-red-500': !qrCodeDetailsForm.valid }"  />
                 </div>
 
                 <div>
@@ -43,10 +43,12 @@
                     </div>
                 </div>
 
-                <button type="button" (click)="generateQR()"
-                    class="w-full bg-blue-500 text-white py-2 px-4 rounded-md hover:bg-blue-600 transition-colors">
-                    Generate QR Code
-                </button>
+                <span title="You have to enter a URL to contiune">
+                    <button type="button" (click)="generateQR()"
+                        class="w-full bg-blue-500 text-white py-2 px-4 rounded-md hover:bg-blue-600 transition-colors disabled:bg-gray-500" [disabled]="!qrCodeDetailsForm.valid">
+                        Generate QR Code
+                    </button>
+                </span>
             </div>
 
             <div class="flex mt-6 flex-col items-center space-y-4">
diff --git a/src/app/sites/generator/qrcode/generator-qrcode.ts b/src/app/sites/generator/qrcode/generator-qrcode.ts
index eac4ac9..3241d22 100644
--- a/src/app/sites/generator/qrcode/generator-qrcode.ts
+++ b/src/app/sites/generator/qrcode/generator-qrcode.ts
@@ -3,12 +3,13 @@ import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
 import QRCode from 'qrcode';
 import { CustomTitle } from "../../../components/custom-title/custom-title";
 import { CustomDescription } from "../../../components/custom-description/custom-description";
+import { NgClass } from "../../../../../node_modules/@angular/common";
 
 @Component({
   selector: 'app-generator-qrcode',
   templateUrl: './generator-qrcode.html',
   styleUrls: ['./generator-qrcode.css'],
-  imports: [ReactiveFormsModule, CustomTitle, CustomDescription],
+  imports: [ReactiveFormsModule, CustomTitle, CustomDescription, NgClass],
 })
 export class GeneratorQrcode {
   qrDataUrl: string | null = null;