::placeholder styles the faded hint inside inputs (keep it readable but distinct from real input). ::selection styles highlighted text — set a brand-colored selection for polish. Both are small touches that make a UI feel considered.
::placeholder styles the faded hint inside inputs (keep it readable but distinct from real input). ::selection styles highlighted text — set a brand-colored selection for polish. Both are small touches that make a UI feel considered.
<!doctype html><html><head><meta charset="utf-8">
<style>::selection{background:#b388ff;color:#06040d}input{padding:8px;background:#0c081a;color:#e6e0ff;border:1px solid #2a1d4a}input::placeholder{color:#8a82b0}</style></head><body style="background:#06040d;color:#e6e0ff;padding:20px"><input placeholder="styled placeholder"><p>select this text to see the highlight.</p></body></html>▶ Open the interactive comic issue