You can use the CSS positions to achieve this (https://developer.mozilla.org/en-US/docs/Web/CSS/position)

return (
  <div className="container">
        <div className="login">
          <img src={pacifyr} alt="logo"/>
          <div className="position-relative">
            <img className="position-absolute" src={Envelope} alt="username"/>
            <input placeholder='username' />
          </div>
          <div className="position-relative">
            <img className="position-absolute" src={Lock} alt="username"/>
            <input placeholder='password' />
          </div>
        </div>
  </div>
)
<style>
.position-relative{
  position: relative;
}

.position-relative input{
  padding: 10px 10px 10px 30px;
}

.position-absolute{
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}
</style>

You can use flexbox for layout

<div className="container">
    <div className="login">
    <div className="row">
        <img alt="logo"/>
    </div>
    <div className="row">
        <img className="icon" alt="username"/>
        <input placeholder="username" className="field"/>
    </div>
    <div className="row">
        <img className="icon" alt="password"/>
        <input placeholder="password" className="field"/>
    </div>
    </div>
</div>

And flexbox style need to be like below

.login {
    width: 300px;
    height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.row {
    margin: 10px;
    display: flex;
    flex-direction: row;
    height: 30px;
    justify-content: center;
}

.icon {
    width: 50px;
}

.field {
    flex: 1;
}

I need to place mail icon and password icon inside the text box, how to align items properly

my js code is:

return (
        <div  className="container">
           <div className="login">
           <img src={pacifyr} alt="logo"/>
           <img src={Envelope} alt="username"/>
           <input placeholder='username' />
           <img src={Lock} alt="username"/>
           <input placeholder='password' />
           </div>
      </div>
    );