Is it possible to make polygon like a wave in css

Posted In HTML & CSS
  • joe-joe 4 months ago
    I did some polygon like a wave, the wave must be on top of the container. I have content before and after the container
    
    I want to do that: https://ibb.co/rMg9q43
    
    but I did: https://ibb.co/h8cBMBk
    
    in HTML:
    
        <div class="container-fluid green"></div>
    in CSS:
    
        .green {
        height: 700px;
        background: #00a985;
        clip-path: polygon(
        38% 0,
        79% 16%,
        100% 8%,
        100% 100%,
        68% 100%,
        0 100%,
        0 76%, 
        0% 43%,
        0 9%
        );
        }

    I did some polygon like a wave, the wave must be on top of the container. I have content before and after the container

    I want to do that: https://ibb.co/rMg9q43

    but I did: https://ibb.co/h8cBMBk

    in HTML:

    <div class="container-fluid green"></div>
    

    in CSS:

    .green {
    height: 700px;
    background: #00a985;
    clip-path: polygon(
    38% 0,
    79% 16%,
    100% 8%,
    100% 100%,
    68% 100%,
    0 100%,
    0 76%, 
    0% 43%,
    0 9%
    );
    }
    
  • andrewo0 4 months ago
    Hi @joe-joe
    
    Why not create a wave svg?
    i think it is a better option.
    

    Hi @joe-joe

    Why not create a wave svg? i think it is a better option.

Please login or signup to leave a response.

Login

or Sign Up

Sign Up

or Login
×
Want to create your own SAAS?

I can teach you to create your own Software as a Service. Click here to learn more!

Visit SAAS Adventure!