react cyber elements

React-Cyber-Elements

+90 องค์ประกอบ HUD Cyberpunk นี่คือและจะเป็นอิสระเสมอ

เราต้องการสร้างโครงการโอเพ่นซอร์ส Cyberpunk ที่ใหญ่ที่สุดเพื่อให้คุณทำสิ่งดีๆ

ขอบคุณทุกคนสำหรับการดูแล! ดูเหมือนว่าคุณจะชอบความคิดของโครงการไซเบอร์ปูนของเรานี่คือเป้าหมายในอนาคตของเรา!

ขั้นตอนต่อไป:

• +1.000 futuristics ไอคอนไอคอน SVG สำหรับ React, Vue, Svelte และ Angular
• เพิ่มองค์ประกอบ HUD อีก 200 รายการในองค์ประกอบ 90 Currect และทำให้พวกเขาสามารถใช้งานได้สำหรับ Vue, Svelte และ Angular
• wrapper และนิทานออนไลน์เพื่อให้ง่ายต่อการค้นหาและใช้ในแอพของคุณ
• สร้างหน้าแฟนซีที่เราแสดงให้เห็นถึงความเป็นไปได้ด้วยองค์ประกอบ HUD ไอคอนและอื่น ๆ ของเรา!
• สร้างสินทรัพย์แฟนซีสำหรับทุกคน (พื้นหลังเสียง/เว็บ/อักขระ/ฯลฯ )

ตัวอย่าง: https://react-cyber-elements-demo.vercel.app/

ยินดีต้อนรับสู่ React-Cyber-Elements คุณสามารถเปลี่ยนสีขององค์ประกอบด้วย CSS

การใช้งานง่าย ๆ : เพื่อชำระเงินเอกสารและ Sandbox สำหรับข้อมูลเพิ่มเติม

ติดตั้ง

NPM

 npm install react-cyber-elements 

เส้นด้าย

 yarn add react-cyber-elements 

การใช้งาน

 import { CyberEl1 } from 'react-cyber-elements'

export default function Home ( ) {
  return (
    < CyberEl1 
      style = { {
        width : '100px' ,
        height : '100px'
      } }
    className = "cyber-icon" />
  )
} 

เปลี่ยนสี

คุณสามารถเข้าถึงแต่ละเส้นทางและเปลี่ยนจังหวะและเติมคุณสมบัติ

. cyber-icon path : nth-of-type ( 1 ) {
  fill : # d600ff !important ;
  stroke : orange;
}

. cyber-icon path : nth-of-type ( 2 ) {
  fill : # 00b8ff !important ;
  stroke : orange;
}

. cyber-icon path : nth-of-type ( 3 ) {
  fill : yellow !important ;
  stroke : orange;
}

. cyber-icon path : nth-of-type ( 4 ) {
  fill : # 001eff !important ;
  stroke : orange;
}

. cyber-icon path : nth-of-type ( 5 ) {
  fill : # bd00ff !important ;
}