import './App.css'; import { useState, } from 'react'; function App() { const [title, setTitle] = useState(""); const [color, setColor] = useState("#112596"); const submit = (e) => { e.preventDefault(); alert(`${title}, ${color}`); setColor('#256987"'); setTitle(''); } return ( <div className="App"> <form onSubmit={submit}> <input value={title} onChange={(e) => setTitle(e.target.value)} type="text" placeholder='color title' /> <input value={color} onChange={(e) => setColor(e.target.value)} type='color' /> <button>Add</button> </form> </div> ); } export default App;
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter