Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <title>How ColorWheelPicker.online Works</title> | |
| <style> | |
| body { font-family: Arial, sans-serif; padding: 2rem; background: #f9f9f9; color: #333; } | |
| pre { background: #eee; padding: 1rem; overflow-x: auto; border-radius: 5px; } | |
| a { color: #0077cc; text-decoration: none; } | |
| a:hover { text-decoration: underline; } | |
| #colorWheel { | |
| width: 200px; | |
| height: 200px; | |
| border-radius: 50%; | |
| background: conic-gradient(red, yellow, lime, aqua, blue, magenta, red); | |
| margin: 1rem 0; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>How ColorWheelPicker.online Works</h1> | |
| <p>This tool lets you pick colors from a color wheel for design and art projects.</p> | |
| <div id="colorWheel"></div> | |
| <h2>Basic Color Wheel Demo</h2> | |
| <p>This example shows a simple CSS conic gradient wheel.</p> | |
| <pre> | |
| <div style="width:200px; height:200px; border-radius:50%; background: conic-gradient(red, yellow, lime, aqua, blue, magenta, red);"></div> | |
| </pre> | |
| <p>Try it live at <a href="https://colorwheelpicker.online" target="_blank" rel="noopener noreferrer">colorwheelpicker.online</a></p> | |
| </body> | |
| </html> |