20 lines
1.0 KiB
Markdown
20 lines
1.0 KiB
Markdown
# Floating gradient (only css)
|
|
|
|
<img src="https://storage.mirzaev.sexy/2022/git.mirzaev.sexy/mirzaev/css-gradient-floating/1.gif" alt="css gradient preview with white theme" height="350"/>
|
|
<img src="https://storage.mirzaev.sexy/2022/git.mirzaev.sexy/mirzaev/css-gradient-floating/2.gif" alt="css gradient preview with black theme" height="350"/></br>
|
|
<small>design based on "/gradient.css" on my site https://account.mirzaev.sexy (see for more updates)</small></br></br>
|
|
|
|
File "/gradient.css" contains gradient css only!
|
|
|
|
### HTML-architecture
|
|
```
|
|
<section class="gradient">
|
|
<a href="">sample text</a>
|
|
<div class="red"></div>
|
|
<div class="green"></div>
|
|
<div class="blue"></div>
|
|
</section>
|
|
```
|
|
<img src="https://storage.mirzaev.sexy/2022/git.mirzaev.sexy/mirzaev/css-gradient-floating/3.gif" alt="codepen preview" width="500"/></br>
|
|
<img src="https://storage.mirzaev.sexy/2022/git.mirzaev.sexy/mirzaev/css-gradient-floating/4.png" alt="codepen preview" width="500"/></br>
|
|
<small>CodePen preview: https://codepen.io/mirzaev-sexy/pen/QWxxxJV</small> |