Log In Sign Up

Get Started

Start with OrcaUI: setup, first instance & Vue/React integration guide.
HomeDocsGet Started
The project has been completed, and we are preparing more content, which will be rolled out gradually in the near future.
Default Sort by ID Recently Updated Featured Most Viewed
  • Learn how to set up an OrcaUI page, reference JS/CSS files in multiple ways, and explore a live CodePen demo. Let’s get started with the OrcaUI front-end framework!
  • Describe the development journey of the OrcaUI framework—it is both an accumulation of experience and a culmination of persistent effort. Staying true to our original vision, we remain committed to the native JavaScript, CSS, and HTML standards, stri...
  • Show the development and version update history of the OrcaUI front-end framework, and publicly release the historical version numbers on this page.
  • Variable and naming abbreviations are primarily intended to improve developer programming efficiency, followed by making it easier for users to remember and quickly use them, and finally to reduce file size. However, when using framework code in the ...
  • OrcaUI's language packs are stored in src/scripts/lang directory, using en-US English by default, with built-in multilingual support for framework internationalization; customize by modifying specific language packs. Language packs use export default...
  • OrcaUI's JS and CSS files are manually minified using Terser, including 3 JS files and 1 CSS file. If users modify the source code, re-minification is required. We recommend installing Terser, which supports modern JavaScript syntax.
  • This framework can be integrated both inside and outside React. It allows using WebComponent components anywhere within React, and its modules can be utilized in the useEffect hook.
  • OrcaUI's CSS styles use the `_` prefix as a namespace identifier. This character is reserved for private/internal use, and users should avoid using it in their custom CSS styles.
  • This framework can be integrated via the `use()` method before `mount`, and can be used within the `mounted` lifecycle hook.
  • Achieves multi-device responsiveness through various methods: width adaptation via @media min/max-width queries, adaptive styling with classes like _xxs-1/_xs-2, mobile device adaptation via @media any-hover, breakpoint configuration using breakpoint...
  • Static resources include large images, thumbnails, cover images, SVG icons, PNG icons, videos, audio, etc., used for demo purposes. Click to get resource links. Files are hosted on npm and delivered via unpkg CDN for fast global access.

New Launch: 20% Off All Products

Unlock all examples and development resources