Premium Yellow/Black Combination Responsive Service Portal Design in ServiceNow with widget code

(Service Portal Design ServiceNow)

Widget 1:

HTML:

<br>    
<div class="box" style="height: 404px;width: 100%;background-image: url(coding.png);"> 
           <br> <br> <br> <br>
  <h2 style="margin-left: 184px;">Welcome to Workingcode.in</h2>
 <input type="text" placeholder="Search.." class="form-control" style="width: 354px;margin-left: 184px;">
      </div>
       <br>

CSS:

div{
  height: 150px;
  width: 252px;
  background: #fff;
  border-radius: 20px;
 }
.box{
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.5); 
  background-color: #f3ca20;
}

Second Widget

HTML:

<br>
     <div class="box" style="height: 190px;width: 100%;background-color: black;"> 
       <br><br><br>
<h2 class="ng-binding" style="
    text-align: center; color:white;
">Request Something</h2>
      </div>
 <br>
   <div class="box" style="height: 190px;width: 100%;background-color: #f3ca20;"> 
            <br><br><br>
<h2 class="ng-binding" style="
    text-align: center; color:white;
">Knowledge Base</h2>
      </div>
 <br>

CSS

div{
  height: 150px;
  width: 252px;
  background: #fff;
  border-radius: 20px;
 }
.box{
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.5); 
  background-color: #f3ca20;
}