Create a beautiful and colorful random name generator tool using HTML, CSS, and JavaScript only.
Requirements:
– Do NOT create full webpage layout.
– Only create the tool section.
– The tool must be mobile responsive.
– The design should look modern, colorful, and attractive.
– Use gradient backgrounds and glassmorphism cards.
– Generated names should appear inside stylish rounded boxes/cards.
– Add smooth hover animation on name cards.
– The “Generate Names” button must appear BELOW the generated names.
– Button should be large, colorful, and attractive.
– Generate 10 random names at once.
– Automatically generate names when page loads.
– Use clean CSS without affecting existing website layout.
– Wrap everything inside a unique parent class to avoid CSS conflicts.
– Keep all CSS and JS included in same code.
– Use lightweight vanilla JavaScript only.
– The code should work perfectly on mobile devices.
– Do not use external libraries.
Tool Topic:
[Centaur Names Generator]
Generator Logic:
– Create random names using multiple arrays and combine them naturally.
– Names should match the theme/topic.
– Generate unique fantasy-style names.
Output:
– Return complete ready-to-paste HTML code only.
– Include HTML, CSS, and JavaScript together.
– No explanation.
Centaur Names
The centaurs are special characters and popular because of their body shape. Their lower body is horse, and the upper body is human. You might have seen these characters in old movies, where these creatures were used as warriors.
Centaur names generated by this Centaur names generator tool are interesting because it generates names in a Greek style, which is popular in that region.
