rainbow / app.py
5digit's picture
Update app.py
5fa0b66 verified
import streamlit as st
import streamlit.components.v1 as components
st.title("Градиент радуги")
# HTML и CSS для создания градиента
gradient_html = """
<canvas id="rainbowCanvas" width="200" height="600"></canvas>
<script>
const canvas = document.getElementById('rainbowCanvas');
const ctx = canvas.getContext('2d');
// Создаем линейный градиент
const gradient = ctx.createLinearGradient(0, 0, 0, canvas.height);
gradient.addColorStop(0, 'violet'); // Фиолетовый
gradient.addColorStop(1/6, 'blue'); // Синий
gradient.addColorStop(2/6, 'green'); // Зеленый
gradient.addColorStop(3/6, 'yellow'); // Желтый
gradient.addColorStop(4/6, 'orange'); // Оранжевый
gradient.addColorStop(5/6, 'red'); // Красный
gradient.addColorStop(1, 'violet'); // Возврат к фиолетовому для плавности
// Заполнение прямоугольника градиентом
ctx.fillStyle = gradient;
ctx.fillRect(0, 0, canvas.width, canvas.height);
</script>
"""
# Использование Streamlit для отображения HTML
components.html(gradient_html, height=600)