Deepseek ArtifactsDeepseek Artifacts

吉卜力牛仔游戏

4.0
en
游戏设计
吉卜力
游戏开发
牛仔主题

Prompt

Create a cowboy game with Ghibli characters 

Generated Result

import React from 'react';
import './App.css';

function App() {
  return (
    <div className="App bg-gradient-to-b from-blue-400 to-green-400 min-h-screen p-8">
      <header className="text-center mb-8">
        <h1 className="text-6xl font-bold text-yellow-300">Cowboy Game with Ghibli Characters</h1>
        <p className="text-xl text-white mt-2">Join the adventure with your favorite Ghibli characters!</p>
      </header>

      <section className="grid grid-cols-1 md:grid-cols-3 gap-6">
        <div className="bg-white rounded-lg overflow-hidden shadow-lg transform hover:scale-105 transition-transform">
          <img src="https://placehold.co/600x400" alt="Character" className="w-full h-64 object-cover" />
          <div className="p-6">
            <h2 className="text-2xl font-bold mb-2">Character Name</h2>
            <p className="text-gray-700">Description of the character and their role in the game.</p>
          </div>
        </div>
        <div className="bg-white rounded-lg overflow-hidden shadow-lg transform hover:scale-105 transition-transform">
          <img src="https://placehold.co/600x400" alt="Character" className="w-full h-64 object-cover" />
          <div className="p-6">
            <h2 className="text-2xl font-bold mb-2">Character Name</h2>
            <p className="text-gray-700">Description of the character and their role in the game.</p>
          </div>
        </div>
        <div className="bg-white rounded-lg overflow-hidden shadow-lg transform hover:scale-105 transition-transform">
          <img src="https://placehold.co/600x400" alt="Character" className="w-full h-64 object-cover" />
          <div className="p-6">
            <h2 className="text-2xl font-bold mb-2">Character Name</h2>
            <p className="text-gray-700">Description of the character and their role in the game.</p>
          </div>
        </div>
      </section>

      <section className="mt-12 bg-white rounded-lg p-8 shadow-lg">
        <h2 className="text-3xl font-bold mb-4">Game Features</h2>
        <ul className="list-disc list-inside text-xl space-y-2">
          <li>Engaging storyline with multiple endings</li>
          <li>Beautifully designed Ghibli-style graphics</li>
          <li>Interactive gameplay with unique character abilities</li>
          <li>Multiplayer mode to play with friends</li>
        </ul>
      </section>

      <section className="mt-12 bg-white rounded-lg p-8 shadow-lg">
        <h2 className="text-3xl font-bold mb-4">About the Game</h2>
        <p className="text-xl">Embark on a magical journey with your favorite Ghibli characters in this cowboy-themed adventure game. Explore vibrant landscapes, solve puzzles, and engage in thrilling battles as you uncover the mysteries of the Wild West.</p>
      </section>

      <section className="mt-12 bg-white rounded-lg p-8 shadow-lg">
        <h2 className="text-3xl font-bold mb-4">How to Play</h2>
        <p className="text-xl">Use the arrow keys to move your character around the map. Interact with objects by pressing the space bar. Engage in battles using the mouse to select actions and abilities.</p>
      </section>

      <section className="mt-12 bg-white rounded-lg p-8 shadow-lg">
        <h2 className="text-3xl font-bold mb-4">Characters</h2>
        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
          <div className="bg-gray-100 rounded-lg p-6">
            <h3 className="text-2xl font-bold mb-2">Totoro</h3>
            <p className="text-gray-700">A friendly forest spirit who helps you navigate through the game.</p>
          </div>
          <div className="bg-gray-100 rounded-lg p-6">
            <h3 className="text-2xl font-bold mb-2">Chihiro</h3>
            <p className="text-gray-700">A brave young girl who can interact with spirits and solve puzzles.</p>
          </div>
          <div className="bg-gray-100 rounded-lg p-6">
            <h3 className="text-2xl font-bold mb-2">Howl</h3>
            <p className="text-gray-700">A powerful wizard who can cast spells and protect the team.</p>
          </div>
        </div>
      </section>

      <footer className="mt-12 text-center text-white">
        <p>&copy; 2025 Cowboy Game Studios. All rights reserved.</p>
      </footer>
    </div>
  );
}

export default App;

More Recommendations

View All

Build ChatGPT-Like Web Interface

4.0
Software Development
en
AI Integration
Full-Stack Development
ChatGPT
UI Design
Backend Orchestration
You are a professional full-stack developer AI with deep experience in building AI-integrated UIs, backend orchestration, and vector memory systems. I want you to build a **web-based ChatGPT-like int...

Flutter 产品列表页

4.0
编程开发
en
Flutter
Dart
产品列表
class ProductListPage extends StatefulWidget { final bool useArabic; const ProductListPage({super.key, this.useArabic = false}); @override State<ProductListPage> createState() => _ProductLis...

Flutter产品列表页

4.0
编程开发
en
Flutter
产品列表
Widget
class ProductListPage extends StatefulWidget { final bool useArabic; const ProductListPage({super.key, this.useArabic = false}); @override State<ProductListPage> createState() => _ProductLis...

Build XO App with AI

4.0
Programming
en
Tic Tac Toe
AI Game
JavaScript
create a complete XO (Tic Tac Toe) app with AI opponent: "Build a modern, fully-featured Tic Tac Toe (XO) app that includes: A clean, user-friendly interface optimized for mobile, tablet, and web. ...

Generate YouTube Subscribers

4.0
Technology
en
YouTube
Subscribers
App
Make an app let generate YouTube subscribers and and comments by enter your username after that the says how many subscribers and like do you want so you type the amount of likes and subscribers , so ...

YouTube Subscribers App

4.0
Technology
en
YouTube
Subscribers
App
Make an app let generate YouTube subscribers and and comments by enter your username after that the says how many subscribers and like do you want so you type the amount of likes and subscribers , so ...