Découvrez les fonctionnalités qui font d'Orochi le framework CSS de choix pour vos projets
Avec seulement 66KB minifié, Orochi garantit des temps de chargement rapides et une expérience utilisateur optimale.
Conçu avec l'approche mobile-first, Orochi s'adapte parfaitement à tous les appareils et tailles d'écran.
Utilisez uniquement les composants dont vous avez besoin grâce à une architecture modulaire et flexible.
Personnalisez facilement les couleurs, les espacements et plus grâce aux variables CSS modernes.
Code optimisé pour des performances maximales, avec un impact minimal sur la taille de votre application.
Un design moderne et épuré avec des animations subtiles pour une expérience utilisateur raffinée.
Découvrez la simplicité et la puissance de la syntaxe Orochi
<!--Boutons-->
<button class="o-btn o-btn-primary">Primaire</button>
<button class="o-btn o-btn-outline-success">Outline Succès</button>
<button class="o-btn o-btn-laptop o-btn-danger">Grand Danger</button>
<button class="o-btn o-btn-phone o-btn-warning">Petit Avertissement</button>
<button class="o-btn o-btn-info" disabled>Désactivé</button>
<!--Grille-->
<div class="o-row">
<div class="o-col-12 o-col-tablet-6">Colonne 1</div>
<div class="o-col-12 o-col-tablet-6">Colonne 2</div>
</div>
<!--Carte-->
<div class="o-card">
<div class="o-card-header">Titre</div>
<div class="o-card-body">Contenu de la carte</div>
</div>
<!--Formulaire-->
<input class="o-form-control" type="email" placeholder="Email">
<select class="o-form-select">
<option>Option 1</option>
<option>Option 2</option>
</select>
<button class="o-btn o-btn-success">Envoyer</button>
Intégrez Orochi à votre projet en quelques minutes
Ajoutez simplement cette ligne dans le head de votre HTML :
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/Orochichrys/orochi-framework@main/dist/orochi.min.css">
Installez Orochi via npm pour une intégration avec vos outils de build :
npm install orochi-css
Téléchargez les fichiers CSS et JS et liez-les localement :
<link rel="stylesheet" href="chemin/vers/orochi.css">
Une collection complète de composants prêts à l'emploi
Une grille responsive basée sur Flexbox avec des breakpoints personnalisables pour tous vos besoins de mise en page.
Des champs de formulaire stylisés, des cases à cocher, des boutons radio et des sélecteurs modernes et accessibles.
Des barres de navigation élégantes qui s'adaptent parfaitement aux appareils mobiles avec un menu hamburger.
Des composants de carte modernes avec des ombres portées et des animations au survol pour présenter votre contenu.
Des alertes contextuelles avec des styles pour le succès, les avertissements, les erreurs et les informations.
Des classes utilitaires pour les espacements, la typographie, les couleurs et les displays pour un développement rapide.
Découvrez ce que les développeurs disent de notre framework
"Orochi a considérablement accéléré notre processus de développement. Sa simplicité et sa légèreté en font un choix parfait pour nos projets web."
Développeuse Front-end
"La documentation claire et les composants modulaires nous ont permis d'intégrer Orochi facilement dans notre workflow existant. Un framework vraiment bien pensé."
Lead Designer
"Nous cherchions une alternative légère à Bootstrap pour nos projets. Orochi a dépassé nos attentes avec ses performances et son design moderne."
CTO, TechSolutions