$circleDiameter: 30rem; // Replace X with the desired diameter in rem
$circleRadius: $circleDiameter / 2;
$totalElements: 11;
$angleIncrement: 360deg / $totalElements; // Equal angle increment in degrees
$animationDuration: 12.5s;
@keyframes circle-motion {
from {
transform: rotate(-90deg) translate($circleRadius) rotate(90deg);
}
to {
transform: rotate(270deg) translate($circleRadius) rotate(-270deg);
}
}
@media (max-width:767px){
$circleDiameter: 24rem; // Replace X with the desired diameter in rem
$circleRadius: $circleDiameter / 2;
@keyframes circle-motion {
from {
transform: rotate(-90deg) translate($circleRadius) rotate(90deg);
}
to {
transform: rotate(270deg) translate($circleRadius) rotate(-270deg);
}
}
}
.section.section--proof .dot--large, .circle__icon {
animation: circle-motion $animationDuration linear infinite;
}
@keyframes circle-motion-small {
from {
transform: rotate(-90deg) translate(1.75em) rotate(90deg);
}
to {
transform: rotate(270deg) translate(1.75em) rotate(-270deg);
}
}
.circle__icon {
animation: circle-motion-small $animationDuration linear infinite paused;
}
.statement--wrapper{
.circle__icon{
animation-delay:var(--anim-delay);
}
}
@keyframes element-blur {
0%, 100% {
filter: blur(3px);
opacity:.2;
}
25% {
filter: blur(0px);
opacity:1;
}
50% {
filter: blur(3px);
opacity:.2;
}
}
.logo__item {
@for $i from 1 through $totalElements {
&:nth-child(#{$i}) {
// Calculate the angle for the current element
$angle: $angleIncrement * ($i - 1);
$randomDistanceX: random($circleDiameter+2) + 15; // Generates a number between 10 and 40
$randomDistanceY: random($circleDiameter+2) + 10;
// Generate a random distance from the center
// Calculate the X and Y positions using trigonometry
$xPosition: $randomDistanceX * cos($angle);
$yPosition: $randomDistanceY * sin($angle);
// Apply the translation
transform: translate(
#{$xPosition}rem,
#{$yPosition}rem
);
//transform: rotate($angle) translate($circleRadius) rotate(-$angle);
$animationDelay: ($angle / 360deg) * $animationDuration * 1;
// Apply the blur animation with the calculated delay
animation: element-blur $animationDuration * 1 linear infinite $animationDelay;
}
}
}
@media (max-width:767px){
.logo__item {
@for $i from 1 through $totalElements {
&:nth-child(#{$i}) {
// Calculate the angle for the current element
$angle: $angleIncrement * ($i - 1);
$randomDistanceX: random($circleDiameter+2) + 15; // Generates a number between 10 and 40
$randomDistanceY: random($circleDiameter+2) + 10;
// Generate a random distance from the center
// Calculate the X and Y positions using trigonometry
$xPosition: $randomDistanceX * cos($angle);
$yPosition: $randomDistanceY * sin($angle);
// Change values for mobile screens
$randomDistanceX: random($circleDiameter+2) + 2; // New value for X on mobile
$randomDistanceY: random($circleDiameter+1) + 25; // New value for Y on mobile
transform: translate(
#{$xPosition}rem,
#{$yPosition}rem
);
//transform: rotate($angle) translate($circleRadius) rotate(-$angle);
$animationDelay: ($angle / 360deg) * $animationDuration * 1;
// Apply the blur animation with the calculated delay
animation: element-blur $animationDuration * 1 linear infinite $animationDelay;
}
}
}
}
//counter
.section {
counter-reset: dotCounter;
}
.section .m--card-wrapper {
counter-increment: dotCounter;
}
.section .m--card-wrapper .dot--large::before {
content: counter(dotCounter);
display:block;
color:var(--color--main);
text-align:center;
}
Dive into all the components that come together to form the Axelar network, for a high-level understanding of the vision, mission and design.Go deeper and gain technical knowledge of how to get started with Axelar.
In New ‘Interoperability Insights’ Paper, Top Institutions Point to Blockchain Interoperability as Critical to Asset Tokenization
Citi, Deutsche Bank, Mastercard, Northern Trust and Centrifuge provide insights on paths to secure, multichain asset tokenization for report produced by Axelar Foundation and Metrika
No items found.
May 22, 2024
Axelar Supports Bridging for Stranded BEP3 Assets from Kava to Binance Chain (PSA)
Following the migration, the Kava community selected Axelar to bridge away any remaining assets that were stranded after the migration. Using various Axelar services, users are able to bridge BEP3 assets to Binance Smart Chain for BEP20 assets.
Tutorials
May 21, 2024
Axelar Adding Interoperability to Rollkit, Delivering Interconnectivity for Thousands of Blockchains Built With Celestia Underneath
Axelar Interchain Amplifier’s Integration With Rollkit Streamlines the Creation of Interoperable Rollups, Making it as Simple as Developing any Smart Contract.
News
Ecosystem
April 4, 2024
How to Deploy an Application With the Same Address Cross-Chain
Learn how to deploy a smart contract at the same address across different blockchains
Tutorials
March 15, 2024
Case Study: How Hinkal Users Mint Access Tokens Across Networks in 1 Transaction
Axelar network facilitates cross-chain Access Token minting and aligns with Hinkal's mission to bring secure and compliant DeFi privacy to the masses
Ecosystem
February 27, 2024
Ripple and Axelar Foundation Partner to Enhance XRP Ledger’s Interoperability Across Blockchains
Developed by Interop Labs, Axelar network integration with the XRPL will help enable secure and efficient transfer of assets across 55+ connected blockchains.
No items found.
February 7, 2024
Interchain Token Service Opens Native-Like Capabilities on 15+ Chains
Frax Finance is among the 1st to adopt no-code Interchain Tokens
News
February 3, 2024
The ‘Axelarator’ Community Program is now Live!
Over 6,000 AXL a month via weekly quests on Galxe
News
January 29, 2024
🛣️ The Axelar Network Roadmap for 2024 🛣️
Axelar network is already the largest cross-chain platform, serving Web3 with more connected blockchains.
Technology
Ecosystem
January 25, 2024
Lido DAO Approves Axelar & Wormhole to Bring wstETH to BNB Chain
Kudos to Lido DAO for running an open & transparent governance process
News
January 24, 2024
Immutable Selects Axelar for Canonical Bridge to Ethereum
Web3's largest gaming platform taps Web3's largest and most secure interoperability network for seamless user interactions across blockchains
News
January 19, 2024
Transacting With AxelarJS
Use AxelarJS to estimate gas costs, query your transaction status, and debug faulty transactions
Tutorials
December 20, 2023
🔔 Axelar 2023 Year in Review 🔔
The year 2023 has been a remarkable year for the Axelar network, brimming with numerous network updates, new features, new integrations, live events, groundbreaking ideas and significant improvements
Ecosystem
Technology
December 12, 2023
The Top DEXs are all Going Cross-Chain
DEXs going cross-chain with Axelar network handle more than half the total 24h market volume on any given day
News
November 21, 2023
How to Stake AXL on the Axelar Network
AXL is the native token of Axelar; by staking it, you are supporting a full-stack interoperability platform that scales securely to all Web3 applications
AXL Token
November 15, 2023
J.P. Morgan & Apollo Deliver ‘Project Guardian’ With Help from Axelar & Others
Next-generation proof-of-concept uses cross-chain infrastructure to advance the $5.5T portfolio management industry
News
Ecosystem
November 14, 2023
Bridging Uniswap & Filecoin: A Cross-Chain Governance Case Study
How Uniswap used Axelar to deploy securely on Filecoin Virtual Machine
Ecosystem
November 13, 2023
Ondo Finance and Axelar Integrate for Cross-Chain Tokenized Secure Notes
Taking native stablecoins and RWAs cross-chain with a solution inspired by Circle's CCTP
News
November 8, 2023
Build Cross-Chain Smart Contracts Simply & Quickly With the Axelar Foundry GMP Example
This repository showcases an example of integrating with Axelar’s General Message Passing using the Foundry framework.
Technology
November 8, 2023
Liquidity Pools for AXL & Bridged Assets on Axelar-Connected Chains
Users of Axelar’s sample bridge app, Satellite, and other bridges built on Axelar, cryptocurrency holders can transfer their assets from any connected chain, to any connected chain
No items found.
November 6, 2023
The AXL Token & the Interchain Future
Axelar network uses battle-tested proof-of-stake consensus. Tokenholders stake the AXL token, delegating tokens to a validator’s staking pool and receiving rewards, minus the validator’s commission.
AXL Token
November 2, 2023
The Optimism Bridge & L2 Interoperability
This guide delves into the process of bridging into Optimism, discussing the benefits and mechanisms of different cross-chain solution
No items found.
October 27, 2023
Heroes of NFT Adopts Axelar to Build the Cross-Chain Metaverse
Heroes of NFT, a native Avalanche project, has adopted Axelar as its infrastructure for cross-chain NFT, gameFi and metaverse applications.
No items found.
October 27, 2023
Axelar AMA: Sergey Gorbunov + Jack Zampolin Talk Cosmos-EVM Cross-Chain, Interop Infrastructure & More
Axelar works closely with various Cosmos chains to provide Cosmos-EVM cross-chain capabilities and link other
%20copy.png)
