A Pen by kaushalya.

index.html

<div class="device">
  <div class="cover">
    <div class="logo">SAMSUNG</div>
    <div class="logo1"></div>
  </div>
</div>

Part---2.markdown

Part - 2

A Pen by kaushalya on CodePen.

License.

style.css

@import url(http://fonts.googleapis.com/css?family=Open+Sans);
@import url(http://weloveiconfonts.com/api/?family=entypo);
/* entypo */
[class*="entypo-"]:before {
  font-family: 'entypo', sans-serif;
}
.device {
  width: 13em;
  margin: 5em auto;
}
.cover {background: linear-gradient(90deg, #040B1D, #0B1023, #263645, #435267 , #77869B);
  height: 23em;
  width: 12.5em;
  border-radius: 2em;
  border: 0.2em solid grey;
  overflow: hidden;
}
.logo {
  font: bold 0.7em 'Open Sans',sans-serif;
  padding: 1.3em 0;
  padding-bottom: 0.4em;
  color: #aaa;
  text-align: center;
  background: linear-gradient(90deg, #040B1D, #0B1023, #263645, #435267 , #77869B);
}
.logo:before {
  background: linear-gradient(#fff, #000, #fff, #000, #fff, #000, #fff, #000);
  border-radius: 3em;
  margin-top: -0.7em;
  height: 0.7em;
  width: 5.3em;
  content: '';
  position: absolute;
}
.logo:after {
  height: 0.7em;
  width: 0.7em;
  background: black;
  border-radius: 1.5em;
  margin: -1em 0.3em;
  content: '';
  position: absolute;
}
.logo1 {
  position: absolute;
  margin: -1.96em 8.96em;
  height: 0.5em;
  width: 0.5em;
  background: black;
  border-radius: 1.5em;
}
.logo1:before {
  height: 0.4em;
  width: 0.4em;
  background: #777;
  border-radius: 1.5em;
  margin: 0.2em 1em;
  content: '';
  position: absolute;
}